html - レスポンシブ グリッドで 2 つの独立してスクロール可能な列を作成する方法は?

Question

マスターと詳細がそれぞれ独立してスクロール可能で、レスポンシブ グリッド内の横に並んだ列であるマスター/詳細画面を表示する必要があります。ブラウザーの幅が特定のしきい値を下回ると、2 つの列が積み重なって、1 つのフルページ スクロールのみになります。

理想的には、これを twitter-bootstrap 内で実行したいと思います。これは単純なはずですか？

Answer 1

Bootstrap で、.scrollable div に「overflow:auto」が設定されたこのようなものが必要だと思います。

ブートストラップは、低解像度で自動的にスタックします。

<div class="row-fluid">
    <div class="span6">
        <div class="scrollable"></div>
    </div>
    <div class="span6">
        <div class="scrollable"></div>
    </div>
</div>