2016-08-03 25 views
0

Ich verwende Bootstrap-Design-Funktionen für meine Anwendung. Ich habe eine Openlayers Map in meinem Hauptcotent.Bootstrap Spalte Höhe 100 des Inhalts mit Openlayers Karte

<div class="container"> 
    <div class="row"> 
    <div class="well"> 
     Header 
    </div> 
    </div> 
    <div class="row"> 
    <div class="col-sm-4"> 
     <div class="well"> 
     <h2> 
      Sidebar 
     </h2> 
     <ul> 
      <li>menu item 1</li> 
      <li>menu item 2</li> 
     </ul> 
     </div> 
    </div> 
    <div class="col-sm-8 fill"> 
     <div class="map" id="map"> </div> 
    </div> 
    </div> 
</div> 

und Javascript-Code ist wie folgt:

var map = new ol.Map({ 
    target: "map", 
    layers: [ 
    new ol.layer.Tile({ 
     source: new ol.source.OSM() 
    }) 
    ], 
    view: new ol.View({ 
     center: [0, 0], 
     zoom: 2 
    }) 
}) 

Working demo is here

Ich möchte Karte Höhe einstellen Spalte (<div class="col-sm-8 fill">) von Seite zu füllen. Aber es füllt nicht 100%.

Antwort

0

So verstehe ich Ihre Frage, ich würde nur eine Klasse .fill in meinem css machen. und stellen die Höhe auf 100%

.Map {

Höhe: 100%;

}