将中间表格单元格调整为内容宽度

Question

目标是让中间表格单元格根据其内部内容调整宽度。

我知道最终可以在表格单元格上使用： width：1px;空白：NOWRAP;

但是，我无法在中间表格上实现这一点。任何建议都将不胜感激。

注意：我知道这在flexbox中是多么容易，而不是寻找flexbox解决方案。

图片供以下参考。

Answer 1

您需要使用table-cell并使用1px宽度作为中心单元格。左右单元格必须是宽度自动：

Time

.table{ display: table; width: 100%;}
.left,.right,.center{display: table-cell; width: auto;}
.left{ background-color: gray;}
.right{ background-color: silver; text-align: right;}
.center{ background-color: black; color: white; width: 1px;}

如果你需要填充，只需在左，右和中间div内使用内部div。