Question

我一直在尝试将我的传单地图的高度更改为引导程序内的百分比，但每次我执行时地图都不会绘制。因此，我总是要恢复到px值。我很确定它是一个简单的设置，因为我是一名CSS新手，所以我很遗憾。这是我的css。

<style type="text/css">
  body {
    padding-top: 60px;
    padding-bottom: 40px;
  }
  #map {
    height: 75%;
    }
</style>

Answer 1

尝试将height属性添加到body或父容器。

Answer 2

<强> CCS

#map
{
    width: 100px;
    height:100px;
    min-height: 100%;
    min-width: 100%;
    display: block;
}

html, body
{
    height: 100%;
}

.fill
{
    min-height: 100%;
    height: 100%;
    width: 100%;
    min-width: 100%;
}

<强> HTML

<div class="container fill">
     <div id="map">

     </div> 
 </div>

Answer 3

使用Github上项目Bootleaf的CSS：

html,body, #map{
    height:100%;
    width: 100%;
overflow: hidden;
}
body {
    padding-top: 50px;

Answer 4

除了将map div的height属性设置为100％之外，您可能还需要实现this以确保地图填充调整大小的div。

Answer 5

body {
    padding: 0;
    margin: 0;
}
html, body, #map, .row-fluid{
    height: 100%;
}

#map {
    width: 100%;
}

.height-css
{
    height: 100%;
}

你的html将是

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span12 height-css">
         <div id="map"></div> 
     </div>
   </div>
</div>

在引导程序内调整传单地图

5 个答案: