1

シナリオ:

テーブル ヘッダーを含む親 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>
4

2 に答える 2

0

overflow: auto「parentDiv」を試して、overflow-xy-Stuff をすべて削除します。

于 2013-02-28T14:06:33.967 に答える
0

水平スクロールを取得するには、少なくとも 2 つの方法があります。あふれているのは段落要素であることを覚えておいてください!!

代替案 1 使用

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

}
.parentDiv p {
    display:inline;
}

そして、すべてのセットのスクロールバーが表示されます

代替案 2

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

}
.parentDiv p {

    overflow:auto;
}

そして、ここに段落のスクロールバーが表示されます

編集コメント: 段落のインライン ルールを省略できます。このフィドルのように。あなたが探していたものであることを願っています。 ここでフィドル子スクロールバー 代替 1

于 2013-02-28T14:31:33.293 に答える