我想使用 CSS 将两个一定大小的框(红色和绿色)绘制到一个表格单元格中。我无法让它们填满表格单元格的整个高度。
这是我目前所拥有的:
td {
background-color: lightblue;
padding: 5px;
}
td.boxes {
padding: 0
}
div.a {
display: inline-block;
width: 3px;
background-color: red;
}
div.b {
display: inline-block;
width: 3px;
background-color: green;
}
<table>
<tr>
<td>Mj</td>
<td class="boxes">
<div class="a"> </div><!--
--><div class="b"> </div>
</td>
</tr>
</table>
最佳答案
将 tr
和 td.boxes
元素设置为 display: flex
并将子 div
高度设置为 100%
。
td.boxes,
tr {
padding: 0;
display: flex
}
fiddle :https://jsfiddle.net/zx5Lvzym/
关于css - 使用 CSS 将固定大小的框绘制到表格单元格的全高,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47004328/