Hi,
I want to know the best way to code a navigation bar that looks like this. I can get it to look the way I want to with absolute positioning and other messy methods but I want to know if there is a best way or something. I’m using Zurb Foundation (SASS).
Basically, two row navigation with logo stacked to side inside 960px container but the backgrounds should extend to the whole viewport.
Sorry for the ugly wireframe thingy.
Can we get the wireframe demo of your attempt? Just something basic? Preferably just put it in a codepen please.
I can’t get it to work in codepen, has a lot of foundation code. Here is a screenshot of my attempt.
That is the full browser viewport width with a Foundation .row in the middle containing my navigation.
Without code we cannot help.
Ok here is a barebones version of what I have now.
http://codepen.io/anon/pen/xbvLdV
Here’s a rough start for you although there are loads of ways you could do this. This one uses no extra mark up for the stripes.
(Stripes only in ie9+)
You would need to add media queries to handle the nav wrapping or change the way that section is laid out.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.
