html - 如何将无序列表置于宽度为 100% 的固定位置 div 中

Question

我正在开发一个网络布局，我在顶部设置了一个导航栏，位置:固定；宽度:100%；这样即使用户滚动它也会停留在视口(viewport)的顶部并占据页面的宽度。我想像这样在其中放置一个居中的水平无序列链接列表(宽度 940px):

<nav id='nav-bar'>
    <ul>
        <li><a href='#'>text</a></li>
        <li><a href='#'>text</a></li>
        <li><a href='#'>text</a></li>
        <li><a href='#'>text</a></li>
        <li><a href='#'>text</a></li>
    </ul>
</nav>

尝试了显示和位置/ float 等的各种组合后，如果我尝试调整页面大小时，如果列表不包含两行，我就无法将其居中。我预计可能需要一些其他包装器来包含该列表。

Answer 1

试试这个 fiddle http://jsfiddle.net/gajjuthechamp/JuYpT/

您只需要 margin:auto 和 display:inline-block。