删除复选框之间的空格

Question

我有一个表单,其中包含几个在div中垂直对齐的复选框.我想删除每个复选框之间的空格.但我找不到任何解决方案.

<div style="height:100px;width:25px;float:left;">
  <input type="checkbox"/>
  <input type="checkbox"/>
  <input type="checkbox"/>
  <input type="checkbox"/>
  <input type="checkbox"/>
  <input type="checkbox"/>
</div>

有没有人有这个问题的解决方案？

Answer 1

我找到了解决方案:

  <input type="checkbox" style="margin: 0; padding 0;  height:13px"/>

对于IE,您需要设置高度以删除复选框之间的空格.

Answer 2

在与CSS大师Paul O'B交谈之后,这是一个适用于IE 6,7,8,FF 3和Chrome的好解决方案:

<style type="text/css">     
    #aDiv input {
        margin: 0;
        padding: 0;
        display:block;
        height:12px;
        overflow:hidden
    }
</style>

<div id="aDiv" style="width:25px">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
</div>

这是使用HTML 4.01严格的doctype.如果你想要复选框的并排边框,请使用13px的高度.

属性选择器将无法在IE 6上运行,因此它将在此处取出.如果您需要添加不是复选框的其他输入元素,请改用class.