排列多个复选框,如网格.没有桌子？

Question

我目前正在开发一个包含大量复选框的大型公式.有没有办法像网格一样显示它们,例如4列？

我知道你可以用表格来做这件事,但如果不是真的有必要,我真的不想用它们来设计.那么有没有CSS的方法？

示例:
[] text [] text [] text [] text
[] text [] text [] text [] text
...

Answer 1

这是一个解决方案,带有完整的复选框标记和CSS,以及一个工作示例.

HTML

.checkbox-grid li {
  display: block;
  float: left;
  width: 25%;
}

CSS

<ul class="checkbox-grid">
  <li><input type="checkbox" name="text1" value="value1" /><label for="text1">Text 1</label></li>
  <li><input type="checkbox" name="text2" value="value2" /><label for="text2">Text 2</label></li>
  <li><input type="checkbox" name="text3" value="value3" /><label for="text3">Text 3</label></li>
  <li><input type="checkbox" name="text4" value="value4" /><label for="text4">Text 4</label></li>
  <li><input type="checkbox" name="text5" value="value5" /><label for="text5">Text 5</label></li>
  <li><input type="checkbox" name="text6" value="value6" /><label for="text6">Text 6</label></li>
  <li><input type="checkbox" name="text7" value="value7" /><label for="text7">Text 7</label></li>
  <li><input type="checkbox" name="text8" value="value8" /><label for="text8">Text 8</label></li>
</ul>

在这里查看工作示例:http://jsfiddle.net/FmV9k/