如何使传单地图高度可变 [英] how to make leaflet map height variable

问题描述

在我的应用程序中，我将地图的div设置为

In my Application I was making div of map as

<div id="map" style="height: 610px; width:100%"></div>

但是为了使我的地图响应我想让高度也100％，如果我使 height：100％那么它不工作。

but to make my map responsive I want to make height also 100%, if I make height: 100% then it is not working.

如何使高度也可变像宽度，

How can I make height also variable like width so that map can be seen properly on any device.

演示： http://jsfiddle.net/CcYp6/

如果您更改高度&

If you change height & width of map then you will not get map.

推荐答案

您需要将父元素设置为 height ：100％; 第一

You need to set the parent elements to height: 100%; first

html, body {
   height: 100%;
}

演示

Demo （这将无法工作，因为没有定义父高度）

Demo (This won't work as no parent height is defined)

你需要这样做吗？所以当你在％中指定一个元素的高度时，第一个问题是： 100％
默认情况下，div的高度为 0px ，所以 100％工作，但将父元素 height 设置为 100％; 将工作。

Explanation: Why do you need to do that? So when you specify an element's height in % then the 1st question that arises is: 100% of what? By default, a div has height of 0px, so 100% for a div simply won't work, but setting the parent elements height to 100%; will work.

这篇关于如何使传单地图高度可变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！