Setting Page Widths


OK, to get the ball rolling

How do I set a flexible page width in Foundation so that the menu bar and page width are the same ie. when the browser window is shrunk width ways, all remains the same width / shrinks proportionally?

This is what I’ve got and don’t seem to be able to resolve it.

At the moment, I get an underhang of about 20 pixels on the menu bar. See the attached jpg:

Mike, whilst I don’t have an answer for you, I’m sure Joe will come to your aid with a suggestion or two. Good luck.

What menu are you using?

If you have that menu inside of a Foundation 1 Column stack, then try checking the Collapse option.


I’m using the Top Bar nav bar inside a Foundation 1 Column Stack. Where do I find collapse please?

Its a setting in the 1 Column stack. We can go back and forth on this for a long time. Its best if I can see either a published website or project file to help out more. There are a bunch of settings in Top Bar to control width as well.


Thanks for the reply and sorry to be a pain.
I’ve uploaded the site to:

Bear in mind that the site is very much in the rough, but I hope you’ll see what I’m talking about.

Turn off Match Content Padding inside Top Bar.

Fantastic. What a star. Thank you. :slight_smile: :slight_smile: :slight_smile: