Question

我有一张宽度为屏幕尺寸80％的桌子。此表包含我的菜单项。菜单项以表格单元格的形式显示。我想要的设计是每个单元格应该只与其中的文本一样宽。但是我也想要一个最后一个单元格，它将是空的并且与表格中的剩余空间一样宽。 I.E我希望最后一个继承表的宽度（剩余空间）。

但是，当我增加表格宽度时，所有单元格都会拉伸，而不是只适合它们的文本。

如何阻止这种情况发生？

谢谢！

Answer 1

将最后一个单元格扩展为占据全宽：

td:last-child {
    width: 100%;
}

...而且，如果你想确保其他单元格中的文字没有崩溃：

td {
    whitespace: nowrap;
}

在这里演示：

Answer 2

通过CSS很简单。您只需将display样式修改为inline。