Docs

[bluetroop2]

http://riverside.bluetroop.com/

Please see the attached screen shot.

On my desktop computer, the side navigation appears fine. However, on my HP laptop computer, the side navigation gets cutoff (without a scrolling option or anything). The user would be forced to scroll down the main content portion of the site to get to the lower footer links in order to move thru the site.

Shouldn’t the side navigation be responsive to the laptop screen proportions? How do I fix this?

[Joao]

Hi There,

I am working in a relatively small laptop computer and everything looks fine on your website.

Also I cannot notice anything based on your screenshot.

Would you mind providing more detailed information about the issue.

Thanks

Joao

[bluetroop2]

There should be 7 selections (pages) accessible on the sidebar.

Home
About Us
Services
First Time & Returning Guests
Pre-Registration Form
Reservation Form
Contact Us

As you can see from the screen shot, only 4 selections are shown and you cannot scroll to get to the others. The menu should be responsive to fit to the screen.

[Paul R]

Hi,

You can try adding this under Custom > Edit Global CSS in the Customizer.

.x-navbar.x-navbar-fixed-left {
    overflow-y:auto;
}

Hope that helps.

[bluetroop2]

http://riverside.bluetroop.com/

I’ve applied the code, but I’m not sure it will work on all laptop screens. What do you think? As I stretch and pull it with the browser window, it appears the navigation would still be cutoff on some laptop screens which are much wider than taller in proportion. Can you test to see?

[Christopher]

Hi there,

Yes it works, it adds scrollbar to navigation.
If you don’t want to add scrollbar, please reduce navbar font size and add following CSS code to customizer:

.x-navbar .desktop .x-nav > li > a {
    padding-top: 7px;
    padding-bottom: 7px;
}

Hope that helps.

[Author]

Posts