中心内容框并留有导航框

Question

虽然通常我没有CSS的任何问题，这次我还没找到解决方案。但我不敢相信之前没有人这样做过：

我的水平顶部有一个导航栏。此导航栏位于页面中间的中心，没有固定宽度。

下面，我有一个内容框，其最大宽度接近顶部导航的宽度，它也居中。

现在，我想要内容左侧的另一个导航框（可以是固定宽度，但最好不要），但内容仍然要居中（不是包含导航和内容的框）。

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

所以代码看起来像这样：

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

有什么想法吗？

Answer 1

如果可以的话，我想推荐以下内容：

1. 用容器包裹上面的元素。
2. 将position:relative应用于此新容器。
3. 接下来，将position:absolute应用于 #sidenav 。
4. 最后，应用right:100%继续定位 #sidenav 它。

你有它！你现在需要做的就是相应的风格。

Here's a fiddle 了一个工作示例。

Answer 2

看看这个demo。

#sidenav绝对定位，其父级为#content。

Answer 3

这可能是您正在寻找的内容：fiddle!