Builder Website Theme has a bug

I purchased the Builder website theme and there seems to be a bug.

When in mobile version of the page if you open the menu at the top the spacing looks nice and spaced well.
If you scroll down so that the top row “top_menu row m0” disappears, then the spacing for the menu changes and is spaced really wide.

maybe something in the bootstrap.css?

I have attached two images to show whats happening. The spacing gets messed up.

Thanks for your help!

Hi there

Please provide link to the page and i will check it

https://colorlib.com/wp/template/builder/

Thank you

this is normal, not the bag, when you scroll down on small screen devices top bar will disappear from the sticky header, you will see an only sticky menu which contains the only logo and hamburger menu, this how the template should work
The top bar is completely hidden by default on devices under 575px

yes, the bar is supposed to disappear but that is not the problem.

Look at the menu…

the spacing of the text in the menu is not correct when the bar disappears.

Good morning

Sorry, but i can’t see anything unusual :frowning: can you mark it on the screenshot?

I have attached an image showing how the menu text spacing changes when the top bar disappears.

you can see that when the top bar disappears, the text spacing is wider.

yet on the sub menu the text spacing matches the original menu with the top bar.

Hello,

I hope you are doing well today.

The site appears to work well on my end too. Please ensure that you have updated your browser or try using another browser to view the page.

Best Regards,
Support

I’ve used latest version of chrome on windows 10
microsoft edge on windows 10
and internet explorer on windows 10

and they all behave the same and produce the same result.

Hello,

This is quite strange.

What kind of customizations have you made? It could be some new change that was made is causing this issue.

Best Regards,
Support

no customizations…it even occurs in the demo

my last images where from clicking on the demo button…

https://colorlib.com/preview/#builder

Good evening

ok, i get it, menu items line height is increased and you can fix this by this css:

.header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
line-height: 40px;
}

Awesome!!!

Works Perfect!

Thank you, and Thanks for your support!!!

:slight_smile:

I see .header_area .navbar .nav .nav-item.submenu ul .nav-item .nav-link
has line-height:45px; …so we should be using 45px not 40px?

I guess that means this one should have it as well?
because the submenu seems slightly bigger as well.

.header_area .navbar .nav .nav-item.submenu ul .nav-item:hover .nav-link
line-height:45px;

Good morning

You can basically use any values you wish, i guess you can make such changes :slight_smile: