如何使 Google 地图容器 Div 的高度和宽度均为 100%？

将 Google 地图容器 DIV 设置为 100% 高度和宽度

许多开发人员在尝试设置 Google 地图容器的宽度和高度时会遇到问题Google 地图容器 div 为 100%。将这些属性设置为 100% 通常会导致地图不可见。

HTML 代码：

<code class="html"><!-- Maps Container -->
<div id="map_canvas" style="height:100%; width:100px; margin:0 auto;"></div></code>

解决方案：

要解决此问题，请确保地图的所有父容器的宽度都设置为 100%。此外，为 #content div 设置固定的宽度和高度：

CSS：

<code class="css">body, html {
  height: 100%;
  width: 100%;
}

div#content {
  width: 100%;
  height: 100%;
}</code>

通过设置这些 CSS 属性，地图现在将占据整个可见区域。

以上是如何使 Google 地图容器 Div 的高度和宽度均为 100%？的详细内容。更多信息请关注PHP中文网其他相关文章！