下の図に示すように、順序を変更せずにDIV(幅と高さが定義されている)の単語を抑制するにはどうすればよいですか?
DIVでそれを行う運がない場合、これを整理するにはどうすればよいですか?
下の図に示すように、順序を変更せずにDIV(幅と高さが定義されている)の単語を抑制するにはどうすればよいですか?
DIVでそれを行う運がない場合、これを整理するにはどうすればよいですか?
column-count
ここにフィドルを使用できます:http: //jsfiddle.net/X3XtK/1/
今あなたのコメントを見ました。各列を最大6アイテムに制限する必要があり、アイテムの数が不明な場合column-count
は注意が必要です。それらをマークアップにグループ化する必要があると思います(たとえば、6つの各グループを独自div
に配置してからフローティングにします)。
小さなjQueryスクリプトでそれを行うことができます。このフィドルを参照してください:http://jsfiddle.net/GlauberRocha/ZwY7q/
ではなくリストとして作成しましたdiv
(ただし、これは簡単に変更できます)。私の例では、アイテムは最初は順序付けられていないリスト(ul
)にあります。それらは再帰的に6x6で取り出され、ol
フロートされる新しい順序付きリスト()要素に入れられます。
元のマークアップで要素をグループ化できれば問題ありませんが(@powerbuoyによって提案されているように)、JavaScriptでそれを行うことには2つの利点があります。