Question

我有多行的表，每行只包含一个单元格。第一行以下的行具有任意的未知宽度。第一行包含未知长度/宽度的任意（可包装）文本。我希望第一行中的（文本输入）采用与表格其余部分采用的宽度相同的宽度，并且正在努力。

<table style="background-color: Green;">
  <tr>
    <td id="row1" style="background-color: Red;">
      <div>
    stackoverflow question stackoverflow question stackoverflow question stackoverflow question stackoverflow question stackoverflow
    question stackoverflow question stackoverflow question stackoverflow question stackoverflow question stackoverflow question
    stackoverflow question stackoverflow question stackoverflow question stackoverflow question stackoverflow question
      </div>
    </td>
  </tr>
  <tr>
    <td id="row2">
      <div style="width: 500px; background-color: Blue;">
    CONTENT IS HERE, WITH SOME (UNKNOWN) WIDTH
      </div>
    </td>
  </tr>
</table>

请注意，<div style="width: 500px;>仅用于说明，以便为后续表格行提供一些宽度。 我不知道表格或行的宽度。

在HTML5 / Standards / IE9 +中，第一行扩展到表容器的宽度。我希望为第一行/单元格分配的宽度匹配表格其余部分的宽度，这就是HTML4 / Quirks / IE8-中发生的情况。我正在寻找一个HTML5 / CSS3解决方案，而不必诉诸于脚本。

我发现“工作”的唯一方法是将row1的td设置为width: 1px;。这似乎限制了第一行的宽度，然后它扩展到表的宽度。这适用于“运行时”，但在Visual Studio中的“设计时”，它呈现的文本溢出到许多行，每行一个单词，这对我来说是不可行的，并且让我觉得这不是这样做的方法。

Answer 1

为什么你在桌子上使用div？只需将表td设置为在css样式表中有宽度？要么如果你想使用div，为什么你使用表格，特别是当表格只有一个字段时。然后只需在样式表中设置边框（如果需要和宽度）。

Answer 2

如果你把宽度：1px不是内联样式，而是作为第一个td的属性

<td id="row1" style="background-color: Red;" width="1">

Answer 3

您应该使用max-width:1px;代替width

HTML5表格单元格/行的宽度与其他单元格相同

3 个答案: