Question

I’m trying to work on a navigation bar much like the one at http://seesparkbox.com/
Generally, When a user is viewing the page in a computer browser window, I want the navigation to go fully horizontal.

However, if the user is looking at the navigation from a smaller width (causing a line wrap of my navigation bar) I would like to re-format the navigation bar by putting the company logo on top of the navigation text, and making the navigation text (links) smaller in size to accomodate the browser size.

I just need a little point in the right direction. If there is a simple answer then great and I really appreciate the help, if there isn’t if there is a tutorial that you know of that can help with this I would appreciate that too.

I’m still fairly new at css.

Answer 1

You can use % width with media Query for a Fluid layout.

Read these article for more

http://css-tricks.com/6206-resolution-specific-stylesheets/

http://css-tricks.com/138-the-perfect-fluid-width-layout/