html - 缩小窗口时列表项移动吗？

Question

这几天我一直在为这个问题苦苦挣扎。我可以解决问题，但以这种方式解决问题并没有给我带来预期的效果。

当我缩小时，我的一个列表项会掉到下一行。我怎样才能阻止这种情况发生？

这是一个 fiddle ，如果你缩小你会看到“三”滴到下一行 http://jsfiddle.net/j5u2Q/

如果我从 .middle 中删除边框并增加填充以使其宽度完全相同，问题不会出现吗？边界有问题吗？

#banner li.middle {padding: 0 16px; border-left: 1px solid #959595; border-right: 1px solid #959595;}

谢谢，

Answer 1

尝试将 min-width 和 max-width 添加到您的容器中。如果需要，高度相同。边框也会为您的元素添加边距，使其每边变大许多已定义的像素(或放大像素)。

Working Fiddle