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

(Pia Douglas) #1

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.

(scott williams) #2


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.

(Pia Douglas) #3

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. .

(Robert Ziebol 🖖🏼) #4

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

(Pia Douglas) #5

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 .

(Pia Douglas) #6

Sorry, posted the wrong screen shot

(scott williams) #7

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.