html - 液柱排列

Question

我正在尝试以表格样式显示一些复选框，但我需要根据屏幕的宽度来确定列数。如果我让他们自己重新安排，我会以这样的方式结束：

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

我需要这样的东西：

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

有可能实现这一目标吗？

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

Answer 1

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

这是小提琴