当窗口调整大小时，无法阻止导航栏中的最后一项下降到下一行吗？
尝试拥有一个水平导航栏，在整个页面上具有等间距的链接。我有 6 个链接，因此我认为每个链接的宽度大约为 16.67%，但这不起作用。
16.5% 有效，直到您调整页面大小，此时导航栏中的最后一项会下降到下一行。有没有一种方法可以防止这种情况发生，以便它们始终在所有窗口大小中居中？
有没有一种方法可以防止用户将窗口大小调整到会导致链接重叠或不完全显示的大小？
到目前为止，这是我的代码：
#navbar {margin:0; padding:0; overflow:hidden; width:100%;}
li {width:100%}
li a {padding: 6px 3px; float:left; width:16.5%; text-align:center;}
<ul id='navbar'>
<li><a href='#'> 1 </a></li>
<li><a href='#'> 2 </a></li>
<li><a href='#'> 3 </a></li>
<li><a href='#'> 4 </a></li>
<li><a href='#'> 5 </a></li>
<li><a href='#'> 6 </a></li>
</ul>
Trying to have a horizontal navigation bar that has equally spaced links spanning across the entire page. I have 6 links, so I figured that each one would have a 16.67% width approximately, but that doesnt work.
16.5% works, until you resize the page, at which point the last item in the nav bar drops down to the next line. Is there a way that I can prevent this so that they are centered at all times and in all window sizes?
And is there a way that I can prevent the user from resizing the window to a size that would cause the links to either overlap or not be fully displayed?
Here's my code so far:
#navbar {margin:0; padding:0; overflow:hidden; width:100%;}
li {width:100%}
li a {padding: 6px 3px; float:left; width:16.5%; text-align:center;}
<ul id='navbar'>
<li><a href='#'> 1 </a></li>
<li><a href='#'> 2 </a></li>
<li><a href='#'> 3 </a></li>
<li><a href='#'> 4 </a></li>
<li><a href='#'> 5 </a></li>
<li><a href='#'> 6 </a></li>
</ul>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
在 Safari 中，它总是搞砸，直到我删除你的左/右填充。不需要左/右填充，因为间距已经由宽度和其他 CSS 确定。
JSFiddle
我不确定 IE 是否会对分数宽度百分比感到满意，所以试试这个。
JSFiddle
In Safari, it's always screwed up until I remove your left/right padding. Left/right padding is not needed since the spacing is already determined by the width and other CSS.
JSFiddle
I'm not sure IE is going to be happy about the fractional width percentage, so try this.
JSFiddle
为#navbar 添加一个比所有元素都大的宽度。
Add a width to the #navbar that is bigger than all the elements.