Question

我在一个固定高度的div里面有一个列表，我怎样才能使li元素溢出上升到其他li元素？

我已经尝试过使用浮动：接下来但是我希望它们从上到下然后向右上下移动直到我结束我的li元素。

我想只使用一个列表，而不是彼此相邻的多个列表。

现在是我的代码，

＆＃13;

.test {
    height: 150px;
    width: 950px;
    border-radius: 10px;
    background-color: gray;
}

＆＃13;

<!DOCTYPE html>
<html>
  <body>
    <div class="test">
            <ol>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                <li><a href="">test</a></li>
                
            </ol>
        </div>
    <body>
<html>

＆＃13;

解释我该怎么做。

Answer 1

实际上你可以这样做：

.test {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}

小提琴：

https://jsfiddle.net/otfzgg52/

更多文档：

http://www.w3schools.com/css/css3_multiple_columns.asp

当到达div元素的底部时，如何让li元素向右移动？

1 个答案: