溢出-x滚动和溢出-y可见

Question

我有一个案例，我必须使用overflow-x:scroll;水平显示内容。

现在在这个Fiddle中，第一个块有overflow-y:scroll;，它提供滚动，用户可以滚动内容。在第二个块中，用户无法滚动内容。我希望在Image中以这种方式输出，用户可以在其中水平滚动并查看内容。

Answer 1

您需要为第二个块定义一个内部容器并为其指定宽度。

<div class="test2"><div>dfdsfdsfds</div></div>

和

.test2 div {
    width: 600px;
}

http://jsfiddle.net/qM45U/8/

原因是默认情况下，当测试达到它的宽度时，它会自动换行，而在y轴内，它只会增加容器的高度（如果允许）。您可以将白色空间设置为nowrap，但最后您将获得世界上最长的单行文本：）

Answer 2

给你的第二个div一个子div来包装具有相同高度但更大宽度的内容。设计风格：

.test2 div {
    width:500px;
    height:100px;
}

<强> jsFiddle example