Question

I have a navigation bar on top, horizontally. This navigation bar is centered in the middle of the page and has no fixed width.

Below, I have a content box, which gets a max-width approaching the width of the top navigation, it is also centered.

Now, I want another navigation box at the left side of the content (can be with fixed width, but better not), but the content still to be centered (not a box including both navigation and content).

problem with center http://img688.imageshack.us/img688/4306/problemcenter.png

So the code looks like this:

<nav id="main-navigation"></nav>
<nav id="sidenav"></nav>
<section id="content"></section>

Any ideas?

Answer 1

Have a look at this demo.

#sidenav is positioned absolutely with its parent being #content.