css - 在块中显示两列

Question

我需要一些帮助来解决一个问题。

在区块一定高度有一个列表。高度大于列表的高度，因此显示为 2 列。

起初我没有填写列表项的第一列，然后是第二列。看起来像这样

css

.wrap{

}
.wrap ol{
    height: 290px;
    width: 500px;
    display: block;
    outline: 1px solid red;
    overflow: hidden;
}

    .wrap ol li{
        width: 50%;
        float: left;
    }

Answer 1

一个简单的方法是使用 CSS 多列。

.wrap{
  column-count: 2;
  -moz-column-count: 2;
  -webkit-column-count: 2;
}

见http://jsfiddle.net/aC4Nc/

要增加与旧浏览器的兼容性，请使用此polyfill