流体柱布置

时间:2013-02-08 16:41:43

标签: html css

我试图在表格样式中显示一些复选框,但我需要根据屏幕宽度决定列数。如果我让他们自己重新安排,我会以这样的结局结束:

+-----------------------------------------------------+
|                                                     |
|   [] label1  [] label2  [] label3  [] label 4       |
| [] label5          [] label6   [] label7            |
|     [] label8  []label9  [] label10  []label11      |
|                                                     |
+-----------------------------------------------------+

我需要这样的东西:

+-----------------------------------------------------+
|                                                     |
|   [] label1  [] label2  [] label3  [] label4        |
|   [] label5  [] label6  [] label7  [] label8        |
|   []label9   [] label10 []label11                   |
|                                                     |
+-----------------------------------------------------+

有可能实现这个目标吗?

我不在乎列的宽度是否相同,但我需要完整的东西来填充100%的容器。

1 个答案:

答案 0 :(得分:2)

#container {
    width:100%;
    height:auto;
    min-height:300px;
    padding:10px;
}
#container div {
    width:70px;
    float:left;
    display:inline-block;
}

这是Fiddle