css - 水平スクロールの親 Div の間、子 DIv を固定のままにする

Question

私はオーバーフローとそれ故に水平スクロールを持つ親divを持っています。これはグリッドを保持し、これのページングコントロールはその下の別のdivにあります

問題は、親 div がスクロールされている場合でもページング div を修正したい (x スクロールのみ)

<div style="overflow:scroll">
<table>data</table>
<div id="bottom">Paging</div>
</div>

Answer 1

最も簡単な方法は、コンテナーから一番下の div を取り出すことです。この div はコンテナー内にある必要がありますか?

http://jsfiddle.net/ollie/rTjB3/

Answer 2

いくつかのオプションがあります:

1. スクロール可能な要素の外にページネーション オブジェクトを配置します
2. 使用してposition:fixed;ください。ただし、位置が固定されている要素は、親要素ではなく、ブラウザのビューポートに従って配置されることに注意してください。つまり、ページャーを正しい位置に配置するには、要素の寸法を知る必要があります。

編集： 固定位置のフィドル

Answer 3

スクロール可能な div の固定 div

#container {
    position:absolute;
     top:150px;
    left:150px;
    width:500px;
    height:500px;
    overflow:hidden;
     border:3px dashed #ffff00;
     padding:0px;
    }

#this_scroll {
    position:absolute;
    top:0px;
    right:0px;
    width:99%;
    height:99%;
    overflow:scroll;
    border:2px solid #000;
    margin:1px;
    background:#B0BDCE;
    }

#close {
     position:absolute;
    top:2px;
     right:21px;
    width:90px;
    height:30px;
    overflow:none;
    border:2px solid #660099;
    z-index:10;
    background:#8C8C8C;
    }



<div id="container">

    <div id="this_scroll">
    <p> some </p> <p> some </p> <p> some </p>
    </div>

    <div id="close">
        close
    </div>

</div>