好旧的IE问题

Question

我有以下代码：

http://jsbin.com/egiju4

这对FF和chrome有效，但显示IE中对齐的所有块。

我已经对它进行了大量修改，但根本无法使其发挥作用。

有人能请我帮忙吗？

提前致谢

Answer 1

将width css规则添加到封装div。

  #block_selector {
    padding: 10px;
    float: left;
    width:400px; /*this*/
  }

Answer 2

将clear:left或clear:both添加到“selectable”类以清除列表项上的浮点数。

Answer 3

在UL元素上设置overflow：auto：

 .selectable { list-style-type: none; margin: 0; padding: 0; overflow:auto; }

更新：

如果您没有在UL元素上另外定义宽度，我不确定哪个版本的IE有问题，但为了安全起见，您始终可以设置宽度：100％：

 .selectable { list-style-type:none; margin:0; padding:0;
               overflow:auto; width:100%; }

Answer 4

将clear: left;规则添加到.selectable：

.selectable { list-style-type: none; margin: 0; padding: 0; clear:left; }

这将确保每个<ul>清除之前的任何浮动元素。