Archived topic
Split theme with sticky menu: Want to stop menu items to line-break
5 replies · Started by Lars on June 13, 2022
With the help of these earlier posts I got my Split theme to behave better with centered logo and sticky menu:
https://generatepress.com/forums/topic/keep-sticky-menu-logo-centered/
https://generatepress.com/forums/topic/centered-logo-aligns-left-on-sticky-navigation/
But now I want the menu items to not line-break. The shopping cart and the search-icon move down and make everything get out of order. How can I fix this?
Webpage: https://nordfro.webease.net
Hi Lars,
Not sure what you want to achieve, if everything stays in 1 line, they will be overlapping each other like this:
https://www.screencast.com/t/bkT3Bcezb
I would suggest adjusting the mobile breaking point, so the menu becomes a hamburger icon when they are about to overlap.
Hi Ying
Actually, in my 1280px-browser the menu bar items do not break into another line, but they do as soon as the menu becomes a sticky menu, which is weird beacause the sticky menu has a smaller logo AND less padding so there is actually more space for them not to break the line.
Hi Lars,
You’re currently setting the width of the Primary Menu on the sticky nav to 100% which is causing the menu bar items to go down.
See: https://share.getcloudapp.com/04uQYWG6
If you remove that CSS code, there’s going to be a range where the menu bar items can fit back again along with the primary menu. It’s when the screen is greater than 890px upon testing.
It gets a bit cramped though. I would also suggest increasing the mobile menu breakpoint.
Hope this helps!
Thank you Fernando, that did the trick. I also followed your advice and changed the mobile menu breaking point.
You’re welcome Lars! Glad that worked!
