OpenLayersマップコンテナの寸法を設定する

Question

私はブートストラップnavbarとOpenLayersマップで基本的なHTMLレイアウトを持っています。

JS Fiddle here。

HTMLは次のようになります。それは地図のdivダウンをプッシュし、私は全体の地図を見るために少しを下にスクロールする必要があるため

<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <a class="navbar-brand" href="#">Title</a> 
    </div> 
    </div> 
</nav> 

<div id="map" class="map"></div> 

問題はナビゲーションバーです。表示される画面の範囲に合わせてマップを制限することができます（下の図のようなスクロールスペースはありません）。ここで

私はacomplishしようとしているものの良い例です。 http://jumpinjackie.github.io/bootstrap-viewer-template/2-column/index.html

Answer 1

あなたはあなたのコードにこれを追加することができます。

#map { 
    height: calc(100vh - 52px); /* 100% of the viewport height - navbar height */ 
}