div宽度不起作用？

Question

我对div中的内容有问题，例如，如果我将一个表放在div中并为该div设置宽度(width:200px !important)，那么它将覆盖该div。那么如何才能将所有内容保留在div中呢？

小提琴示例： http://jsfiddle.net/ebG9N/45/

Answer 1

您将标题设置为white-space: nowrap;因此，浏览器无法断开标题，因此表格的宽度将大于容器div。

您可以设置overflow: hidden;来剪切溢出的部分，或overflow: auto;来创建滚动条，但没有它们就是正确的渲染。

Answer 2

有两种解决方案。

i）如果你想严格包含表格WITHIN div，那么overflow:auto;就是你要走的路。

ii）但是如果你改变主意并希望将div除以表的宽度。 display:table;是要走的路。

通常，在明确知道的更宽的元素中包含更宽的元素是个坏主意。

Answer 3

尝试在div的css中使用overflow:auto;。

Answer 4

你不能指望它以某种方式适合你想要的任何大小的div。您可以做的是，至少允许浏览器使用以下方式滚动（overflow: scroll）：

div.divano{
    width:200px !important;
    border:2px solid yellow;
    background:#eaeaea;
    height:200px;
    overflow: scroll;
}

您也可以使用oveflow: hidden，但它只会隐藏不可见的部分。此外，overflow: scroll将始终显示滚动条（带或不带剪辑）。您可以使用overflow: auto指定仅在剪切发生时滚动内容。