高さがページの 100% に設定された div (この例では #container と呼びます) があります。#container には、101 個の項目を持つ順序付きリストがあります。#container の高さに基づいて順序付けられたリストを列に分割する、クリーンで効率的な方法を探しています。ご想像のとおり、このサイズの順序付きリストは、#containers の高さよりもはるかに大きく垂直方向に拡張されます。#container を展開する必要がないように、OL が自動的に列に分割されるようにします。
質問する
233 次
1 に答える
0
このようなものを試すことができます
#container {
width:100%; //or whatever width you have
height:100%;
}
ul {
padding:0;
margin:0;
list-style:none; // gets rid of typical behavior of ul
}
li {
position:relative;
width: 200px; // some specific width, play with this value.
height: 200px;
float:left;
}
@media ディレクティブを使用して、使用可能な画面の幅に応じてリスト項目のサイズを調整し、固定サイズではなくパーセンテージを使用することをお勧めします。
ところで：#container {min-height:100%;}1つの画面に常にスペースがあるとは限らないので、あなたも使用する必要があると思います.
于 2014-05-03T22:28:50.147 に答える