如何调整使用bootstrap设置的表格的td？

Question

我看过http://getbootstrap.com/css/#tables并没有提到以任何特定方式调整tds的大小，所以我尝试了下面的css：

.cbCell {
    width: 25px;
}

.smallerCell {
    width: 240px;
}

.textfield {
    width: 230px;
}

使用此html

<thead>
      <tr>
        <th class="cbCell"><input type='checkbox' class='form-control' id='selectall'></th>
        <th class="text-center smallerCell">Employee Name</th>
        <th class="text-center smallerCell">Mail</th>
      </tr>
    </thead>
    <tbody>
      <tr id='addr0'>
        <td class="cbCell"><input type='checkbox' class='form-control case'></td>
        <td class="smallerCell"><input type="text" name='name0'  placeholder='Name' class="form-control textfield"/></td> 
        <td class="smallerCell"><input type="text" name='mail0' placeholder='Mail' class="form-control textfield"/></td>
      </tr>
      <tr id='addr1'>
      </tr>
    </tbody>

文本字段已经调整大小但是td没有，“小小的细胞”＆＃39;风格尚未应用

我尝试了Change column width bootstrap tables，但对我来说并不适用。我使用网格系统将建立信息浮动到右边，我最终希望名称和邮件列适合较小的文本字段大小，并且有一个边距和垂直规则划分人员和企业列。

Answer 1

将表格宽度更改为自动。在引导表中，宽度设置为100％

.table {
width: 100%;
margin-bottom: 20px;
}

所以做到这一点

.table {
width: auto;
}

在你的css。