Question

我的网站允许用户使用PHP生成表格。行和单元格的数量是可变的，但列数始终是固定的。该表通常生成两位数字。当表生成三位数字时，整个表格会扩展以适应这种情况，并且表格的大小会增加，从而破坏我的布局。有没有办法使用CSS并设置此表的tds样式，以便在生成3位数时表不会更改大小。（3位数字最长）。我尝试在表格中添加填充，但它不起作用。

另外，我应该在表格或类中使用id吗？

Answer 1

td {
  width: 50px;
}

我觉得这样的事情对你有用。显然，您可以根据需要调整实际宽度。

如果你有多个表并且只想修复一个，请给有问题的人一个id：

<table id="fixed_table">

然后在css中，你可以说：

#fixed_table td {
  width: 50px;
}

并且它只会影响该特定表中的tds。当然，如果你想影响一些表而不影响其他表，你可以使用一个类而不是一个id。

Answer 2

您可以使用width和max-width的组合：

td {
    border: 1px solid #ccc;
    width: 2em; /* or whatever... */
    max-width: 2em; /* or whatever... */
    height: 2em; /* or whatever... */
    line-height: 2em; /* or whatever... */
    text-align: center; /* a personal aesthetic choice... */
    overflow: hidden; /* to prevent overflow... */
}

JS Fiddle demo

（请注意，虽然我在演示中使用jQuery，但这只是为了生成内容而不是演示工作所必需的。）

Answer 3

在列上设置固定宽度。

样式CSS表td

3 个答案: