Question

似乎有一个类似的问题，它通过添加padding-right来解决。但是，在我的情况下，这将无法工作，因为我不知道我的任何div的宽度，直到内容在运行时通过ajax调用呈现。我有类似的东西

假设下面的伪代码在语法上是正确的。

<div id="parent">
    <div id="child1"> Lots of contents </div>
    <div id="child2"> Lots of contents </div>
</div>

#parent {
    overflow: auto;
    max-width: 600px;
}
#child1 , #child2 {
    display: inline-block;
    max-width: 300px;
}

Answer 1

您可以将overflow-x设置为hidden，将overflow-y设置为auto。这将为您提供垂直滚动而无需水平滚动。

#parent { overflow-x:hidden; overflow-y:auto; }
#child1, #child2 { overflow-x:hidden; overflow-y:auto; }

Answer 2

您正尝试在child1和child2元素上使用自闭标记。这在大多数浏览器中都无法正确呈现。虽然有些浏览器会使用结束标记重新编写DOM，但这并不是一种好习惯，因为这些浏览器只能在某些周边内重写（真正依赖于包含元素的类型）。

以下是带有自闭标签的代码：http://jsfiddle.net/nMPwV/

以下是包含结束标记的代码：http://jsfiddle.net/nMPwV/1/

垂直滚动条导致水平滚动条

2 个答案: