HTML/CSS中的广播/复选框对齐方式

以下适用于Firefox和Opera(对不起,我目前无法访问其他浏览器):

    
    Option 1

CSS:

.form-field * {
    vertical-align: middle;
}

我发现最好和最简单的方法是这个,因为你不需要添加标签,div或任何东西.

input { vertical-align: middle; margin-top: -1px;}

我根本不会使用表格.CSS可以轻松地做到这一点.

我会做这样的事情:

   

      
      Option 1
   

p { margin: 0px 0px 10px 0px; }
input { float: left; width: 50px; }
label { margin: 0px 0px 0px 10px; float: left; }

注意:我使用了以下的clearfix类:http://www.positioniseverything.net/easyclearing.html

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */