Foundation menu name flowing on 2 rows on google chrome ok is on safari

Hi, working on foundation and stacks. using rapidweaver menu. when I preview in safari it is fine but when previewed on google chrome the menu names are split on two level. tried playing with font size and padding and margin not to avail. Any suggestion other than code would be welcome.


This is usually caused with TopBar when you have more in the menu than will fit. Could be that you are “right on the edge” space wise that’s why ok with one browser and not the other.
Want to check? uncheck show in navigation on one of your pages and see if it starts working as expected.

1 Like

Hi scott, Thank you for your input. The site is not published yet, I was just checking that it worked in all browser, but I can post this screen shot of google chrome. .

You have too many menu items for it to stay on one line.

Hi Robert,

Thank you.
As you can see it works fine with safari. every page name is made of 2 words and there is only 5 pages. I don’t quite see how can shorten stained glass or silk painting .

Sorry, posted the wrong screen shot

One other thing you can try is removing dividers, sometimes a few pixels make the difference

Edit: One other thought, is your zoom set to more than 100% in chrome?

Other than that, can’t help much without a URL so I can see the code.

1 Like