Question

情境：

我有一个包含表头的父div和一个包含表数据的子div。

目的：

我希望能够水平滚动，从左到右滚动所有内容，如果表数据垂直溢出，我希望能够在视图中垂直滚动。

问题：

如果表数据垂直溢出且宽度超过父容器，除非我滚动，否则我看不到垂直滚动条，因此标题。

我在这里设置了一个例子：http://jsfiddle.net/uRHkU/2/ - 我正在努力实现这个目标吗？

<div class="parentDiv">
    <p>very very very long header</p>
    <div class="childDiv">
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
        <p>content that stretches the full width</p>
    </div>
</div>

Answer 1

在“parentDiv”上尝试overflow: auto并删除所有overflow-xy-Stuff。

Answer 2

您至少有两种方法可以获得水平滚动请记住，这是你的段落元素溢出!!

备选方案1 使用

.parentDiv
{
    width: 500px;
    height: 300px;
    overflow:auto;

}
.parentDiv p {
    display:inline;
}

您将获得所有设置的滚动条

备选方案2

.parentDiv
{
    width: 500px;
    height: 300px;

}
.parentDiv p {

    overflow:auto;
}

在这里，您将获得段落的滚动条

已编辑的评论：您可以省略该段落的内联规则。就像在这个小提琴。我希望你能找到它。 在这里摆弄Child scrollbar Alternative 1

在父容器中控制子容器滚动条

2 个答案: