css - 具有正确固定导航的居中内容会导致 z-index 问题

Question

我有一个居中的容器布局和一个右边的固定导航 div。为了使固定导航在视口(viewport)调整大小时保持在原位，它在一些嵌套的 div 中设置。问题是导航 div 最终出现在内容的前面。我可以更改 z-index 顺序，但我希望内容和导航都可以访问，例如能够“标记”文本。对此有什么想法吗？下面是代码链接和显示布局结构的图像

http://jsbin.com/aliru5/3/edit

Answer 1

你正在使它变得比它需要的更复杂，试试这个:

<div id="container">
 <div id="content"></div>
 <div id="nav"></div>
</div>

#container {
margin:0 auto; /* center container in browser */
overflow:hidden; /* clear floats */
width:900px
}
#content {float:left;width:640px}
#nav {float:right;width:240px}