Sidebar navigation hidden when not in full page view or on smaller screen sizes

Support
#1

Hi there,
On my site focusedkids.org, when you view the site in a browser window on a smaller screen laptop, parts of the submenu get cut-off and there is no way to view them. I have attached a screenshot.

Is there any way to fix or combat this problem?

Thanks for the help!

Marcus

#2

Hi Marcus,

Thank you for writing in, on Theme Options > Header there is a Navbar Scrolling option.



Unfortunately, that does not support submenus, so there is no other way but we need to offset the position of submenu upward.

Please add this to Theme Options > CSS

@media (min-width: 980px) and (max-width: 1366px) {
		#menu-item-650 ul.sub-menu,
	#menu-item-642 ul.sub-menu,
	#menu-item-708 ul.sub-menu {
		top: -200px;
	}
}

Hope it helps,
Cheers!

#3

Thanks for that. I see what you are trying to do but that didn’t seem to accomplish it. Can you double check the code for me?

Thanks so much!

#4

Hi,

You can try this code instead.

.masthead-inline .x-navbar.x-navbar-fixed-left .desktop li.menu-item-665 .sub-menu,
.masthead-inline .x-navbar.x-navbar-fixed-left .desktop li.menu-item-642 .sub-menu,
.masthead-inline .x-navbar.x-navbar-fixed-left .desktop li.menu-item-708 .sub-menu {
    top: auto;
    bottom:0;
}

Hope that helps

#5

Ok that mostly did the trick. I think that will suffice. Thank you!

#6

Glad that we could be of a help :slight_smile:

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.