如何使表格单元格宽度自适应？

Question

我正在尝试创建一个简单的表格，其中有3列：第一/最后一列应该采用其子元素的确切宽度，而中间列应该拉伸并填充其余部分。

.table {
  display: table;
  width: 100%;
}

我尝试过使用<table>元素以及flex，但不确定如何实现。

我可以使用flex逐行进行操作，但是第一/最后一列在各行之间将无法对齐。此外，我不想为第一/最后一列设置固定宽度。

- Gilad Novik

---

将 width:100% 添加到中间一个。 - Temani Afif

@TemaniAfif 哇，太简单了，它起作用了！！！ - Gilad Novik

Answer 1

您可以使用以下CSS代码来实现此操作：

.table tr td:nth-child(2) { width:100% }

- PierreN

Answer 2

根据@TemaniAfif的评论，答案非常简单：

<table>
    <tr>
        <td>1</td>
        <td style='width: 100%;'>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>-</td>
        <td>6</td>
    </tr>
</table>

- Gilad Novik