復選框對齊

Question

我想弄清楚為什么th復選框從未與列的其余部分對齊。 所有復選框均應居中對齊。

http://jsfiddle.net/waZRR/

更新：實際活動版本

我的連結

Answer 1

添加此樣式規則，

.table thead th:first-child,
.table tbody td:first-child { text-align: center; }

演示： http : //jsfiddle.net/skram/waZRR/3/

您的現場版本與您擺弄的版本有所不同。 但是問題出在myccs.css的以下樣式上，

table .checkbox {
    margin: 0 !important;
    padding: 8px 13px;
}

嘗試添加如下所示的樣式，

table .checkbox {
    margin: 0 !important;
    padding: 8px 0px !important;
}

Answer 2

桌面上的填充物大於單元格上的填充物。 您將需要修改其填充以使您的th復選框與td的其余部分對齊，如下所示：

.table thead th {
  padding:7px;
}

更新的小提琴： http : //jsfiddle.net/waZRR/1/

Answer 3

您的運球示例通過

 table tr td:first-child { text-align: center !important; } 

http://jsfiddle.net/waZRR/4/

更新

Vega的解決方案顯然更好！ 別理我^^

更新2

按照Vaga的建議使用CSS，並添加新的填充規則。 像這樣：

 .table thead th:first-child,
 .table tbody td:first-child { text-align: center; padding:4px 0px; }

然后看起來不錯:)