Question

我在<table>标记内有一个<div>，只要需要，就不想跨越。我需要在px中为<table>指定宽度，从而导致其内部的<div>容器滚动。否则，<table>只会跨越100％的宽度，即<div>的宽度。

我的例子如下：

<div style="width:880px; overflow:scroll;">
    <table> // I need to explicitly specify a width for it, otherwise it just span 100% which is incorrect
        <tr><td></td><td></td><td></td></tr>
    </table>
</div>

我已在CSS中为所有<td>标记指定了宽度。

我不明白为什么<table>无法确定自己的宽度或只是尊重所有<td>标签的宽度。

Answer 1

尝试在表格的white-space: nowrap;上设置td，并在每个td中转储大量文字，您将开始在div上看到滚动条。

Answer 2

您确定没有任何非预期的CSS应用于该表吗？默认情况下，表格仅展开以适应其列。

<div style="width:880px; overflow:scroll; background-color: green;">
<table style="background-color: red;">
    <tr>
        <td>one</td>
        <td>two</td>
    </tr>
</table>  
</div>

使用此代码，只要不涉及其他CSS，您就可以看到红色表只有与绿色div相关的列一样大。

使用Firebug或IE的开发人员工具（F12）等工具查看实际应用于table元素的样式。

See the example here.

表不想在div内拉伸

2 个答案: