如果Li的样式为"float:left;",如何为UL创建边框？

Question

我对ul的css是:

ul {list-style-type: none; margin:auto; border-top: 1px solid #0093a7; border-bottom: 1px solid #0093a7; margin: 20px 0;}
ul li {float:left; padding:5px;}

UL标签:

<ul>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
</ul>

现在两个边界都在UL的顶部.如何制作底部边框呢？

Answer 1

您需要申请overflow:hidden,ul以便您的花车被清除并包含在ul.

目前您ul正在折叠,因为它只包含浮动元素.

如果你需要支持IE6(？!)那么你需要确保你的容器(即.ul)hasLayout以使溢出技巧起作用.您可以通过应用宽度来完成此操作.