垂直居中複選框，在引導表格單元格

Question

我要垂直居中引導程序表格單元格中的複選框，這是我現在有：

<div> 
    <table id="mytb" class="table table-hover table-condensed"> 
     <thead> 
      <tr> 
       <th style="width: 25%;">A</th> 
       <th style="width: 40%">B</th> 
       <th style="width: 35%">C</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Blah</td> 
       <td>Blah More</td> 
       <td class="vcenter"><input type="checkbox" id="blahA" value="1"/></td> 
      </tr> 
      <tr> 
       <td>Blah</td> 
       <td>Blah More</td> 
       <td class="vcenter"><input type="checkbox" id="blahA" value="1"/></td> 
      </tr> 
      <tr> 
       <td>Blah</td> 
       <td>Blah More</td> 
       <td class="vcenter"><input type="checkbox" id="blahA" value="1"/></td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

/* CSS */ 
td.vcenter { 
    vertical-align: middle; 
} 

這裏舉例：http://jsfiddle.net/dRgt2/2/。很顯然，複選框位於單元格的下半部分。

請注意，在上面的小提琴中，我已經試過這個問題的解決方案：Centering a button vertically in table cell, using Twitter Bootstrap，但它似乎並沒有在我的情況下工作。

我正在使用最新的Bootstrap 2.3.2，如果這有所作爲。

Answer 1

刪除邊距的複選框集中對準複選框。

input[type="radio"], input[type="checkbox"] { 
    line-height: normal; 
    margin: 0; 
} 

Answer 2

簡單隻需添加自定義樣式複選框

input[type="checkbox"]{ 
    margin-top: 0; 
    line-height: normal; 
}