我在 <div>
中有一张 table 我想设置表格 width
其父 div 的 100%。这是 HTML:
<div class="container-fluid">
<div class="row-fluid">
<div class="col-md-12">
<div class="row custom-row">
<div class="col-md-2 title">
<strong>Shift</strong>
</div>
<div class="col-md-10 custom-table">
<table>
<thead>
<th>heading1</th>
<th>heading2</th>
</thead>
<tbody>
<tr><td>cell11 </td> <td> cell12</td></tr>
<tr><td>cell21 </td> <td> cell22</td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
我的期望很简单。表格宽度应与 col-md-10 custom-table
完全相同.我正在尝试以下操作:
.custom-table table {
width: 100%;
}
但是表格的左右两边有一些空格,如下图:
你可以看到带有红色标记框的div,我设置了1px solid
表格上的边框以可视化表格宽度。为什么表格没有被划伤以适应其父 div 宽度。我检查了 div 或表格上的填充、边距。没有填充或边距。任何想法?
最佳答案
将此 CSS 添加到您现有的 CSS。仅在需要时添加 !important
。
.custom-table {
padding: 0 !important;
}
关于html - 为什么表格会在左右两侧添加额外的空间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53705164/