チェックボックスとラベルタグを揃える方法は？

Question

可能性の重複：
How to align checkboxes and their labels consistently cross-browsers

私はこのコードを持っている：

<div id="form-footer"> 
    <ul> 
     <li> 
      <label for="test">Label text</label> 
      <input type="checkbox" name="" value="" id="test" /> 
     </li> 
    </ul> 
</div> 

はどのようにして、ラベルとチェックボックスを揃えることができますか？ラベルの上にチェックボックスが一番上に並んでいるのを見たら、私はそれを真ん中に見たいと思います。

Answer 1

すべてが1行である場合は、行の高さのプロパティを使用できます。

#form-footer li { height: 30px; line-height: 30px; /** same as height */ } 

Answer 2

​input[type=checkbox] { vertical-align: middle; }​ 

それともvertical-align性質