Header displaying horizontal scrollbar on rollover when it's not necessary

[shirtacus]

When all the menu items fit on the screen on the header the scrollbar still displays. I also see this scrollbar on tablets and phones. Is this how these headers intend to deal with too many menu items when the screen size is too small? Is this normal behavior for mobiles? Should the header not collapse for small screens?

1. How can I stop the scrollbar from showing when everything fits?

2. How can I have that same header behave properly on mobile devices?

PS. I am using a child theme and the integrity stack

https://thewisdomofthepenis.com/

[Joao]

Hi There,

That is the content scrolling functionality.

Please turn off content scrolling functionality on your BAR.

Note that on Pro Header builder the menu wont go responsive automatically.

You need to setup the functionality your self, this is done so you have much more flexibility when setting up your menu layouts on desktop and mobile.

Each BAR, Container and Element has a Customize tab. On this customize tab you will find a Hide based on screen width option.

So in your case for example, you could click on the Customize tab of your inline menu. Setup so it is hidden on tablets and mobile. Add one of the mobile menus, like the modal or slide in menu, and hide on desktop and laptops also using the customize tab. You will also need to re-assign your menu to your mobile elements.

Hope it clarifies.

[shirtacus]

Joao,

You are such great help. Problem solved!

[thai]

Glad we’re able to help.