javascript - 別の div での div ステップを回避できません

Question

問題のサイトはこちら。

私が解決する場合に備えて説明させてください。そうすれば、誰もがそれについて知ることができます。

次のhtmlコードを持つ2つのdivがあります

<div id="dataview" class="data-views" style="width:100%; height:580px; padding:0; border:solid; margin-bottom:10px;">
    <div class="row-fluid">
       <div class="col-md-8">
            <div class="timeline"></div>
                        &nbsp;
        </div>
        <div class="col-md-4">
             <div id="map" class="map"></div>
        </div>
     </div>
</div>

私が話している2つのdivは、"col-md-8"とです"col-md-4"

ウィンドウのサイズを変更しようとすると、2 番目の div が最初の div の下部に移動しますが、その背後にある他のすべてがカバーされます。私はcssで遊んでみましたが、成功しませんでした。なにか提案を？

編集： 問題のスクリーンショット フルウィンドウでの様子： screen1 サイズ変更後の様子： screen2

編集2：解決策として何かを考えていますが、私にとっては複雑です。誰かが助けてくれるかもしれません。画面のサイズが col-md-8 より小さい場合 (2 番目の div が下に移動するため)、div の高さ (データビュー) を 580+(マップの高さ) に変更します。

私はこれを試しました：

<script>
$(window).resize(resizemap);
    function resizemap() {
        var winWidth = $(window).width();
        if (winWidth < 995) <--on 995px the map doesn't fit and move on the bottom.
        {
            var Hmap = $("#map").height();
            $('#dataview').css("height", 580+Hmap);

        }
    }
</script>

問題は、div 全体のサイズを変更する代わりに、タイムラインの高さだけを変更することです。そしてまた地図が動く。