checkbox & radio 的对齐问题

　　不只不一样浏览器不一样，不一样的字体,不一样的文字大小也会表现不同。

重置 form checkbox & radio

　　由于不一样浏览器解析不同，有些是默认margin，有些是默认padding，还有ie6,7连margin和padding即便设置为0后，所占的空间仍是比较大，因此仍是有必须重置下，这样就能解决不少没必要要的麻烦。

如下是 14px Arial 字体的解决方案：

一、css代码

.form { font: 14px/18px Arial, Helvetica, sans-serif; }
.form input, .form label { vertical-align: middle; }
.form label { margin-right: 6px; }
.form_checkbox, .form_radio {
    margin: 0 3px 0 0;/*与右侧文字的间距*/
    padding: 0;
    width: 13px;
    height: 13px;
    /*ie7 ie6 根据不一样的 font-size 设置不一样的值*/
    *vertical-align: 1px;
}

二、html代码

<form name="form1" method="post" action="" class="form">
  <p>
    <input type="checkbox" name="checkbox4" id="checkbox4" class="form_checkbox">
    <label for="checkbox4">checkbox4</label>
    <input type="checkbox" name="checkbox5" id="checkbox5" class="form_checkbox">
    <label for="checkbox5">checkbox5</label>
    <input type="checkbox" name="checkbox6" id="checkbox6" class="form_checkbox">
    <label for="checkbox6">checkbox6</label>
  </p>
  <p>
    <input type="radio" name="radio" id="radio4" value="radio4" class="form_radio">
    <label for="radio4">radio4</label>
    <input type="radio" name="radio" id="radio5" value="radio5" class="form_radio">
    <label for="radio5">radio5</label>
    <input type="radio" name="radio" id="radio6" value="radio6" class="form_radio">
    <label for="radio6">radio6</label>
  </p>
</form>

三、效果图