无法通过Google地图覆盖完整的正文元素

Question

我正在开发一些网络应用，我希望用谷歌地图覆盖完整的html / body元素，但无法找到合适的解决方案......

这是我的代码

HTML

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

CSS

body,html{
    height:100%;
    width:100%;}

#map {
    position:relative;
    overflow:hidden;
    height: 100%;
    width: 100%;}

我在我的代码中包含了normalize.css文件。请告诉我我做错了什么..？ 它使用绝对定位，而不是其他位置属性。

Answer 1

如果你只是在地图ID上使用min-height怎么办？

body,html{
    height:100%;
    width:100%;
    margin: 0;
    }

#map {
    min-height: 100%;
    border: solid 1px;
    }

Answer 2

通过以＆＃39;视口高度＆＃39; 格式指定高度，它的工作正常。

#map{
    height: 100vh;
    width: 100%;}

Answer 3

嘿，你不需要使用定位只需使用

#map{
    height: 100vh;
    width:100%;
}