用于压缩导航链接或修复它们占用的空间以使它们不会奇怪地包裹的技术

时间:2011-08-18 18:37:20

标签: css html5 layout nav

这是我经常遇到的一个问题:

考虑到一些横向导航链接,有哪些方法可以确保链接不会挤压在一起,以便它们向上或向下推到两条线上?

我认为只为这些导航链接的容器设置最小宽度就可以了(例如将ul或ul的容器div设置为min-width:500px)但是如示例所示,这不是足够。我觉得我只是缺少一些简单的东西,但这是一个未知的未知。

编辑:我删除了li元素的一些边距,最后它停止换行到两行。我仍然不明白为什么添加填充导致包装而不是简单地扩展包含元素的宽度。

那么你们有什么技巧可以让导航链接保持在横条形状中?

这是一个jsfiddle,大致上是我正在使用的当前示例: http://jsfiddle.net/tchalvakspam/nE8yU/5/

1 个答案:

答案 0 :(得分:0)

你想要它们可见吗?如果你不想让它们换行,一个选择是让它们不被显示。如果你想这样做,这将有效:

#admin-header {
    overflow: hidden;
    white-space: nowrap;  
}