Google Maps CSS 不显示地图

【问题标题】：Google Maps CSS don't show mapGoogle Maps CSS 不显示地图
【发布时间】：2012-04-14 19:25:41
【问题描述】：

我在将 Google 地图添加到我的项目时遇到了一些问题。当我将它放入正文标签时，它可以工作。但是当我有这样的结构时

<body onload="initialize()">
<div>
<div id="map_canvas" style="width:100%; height:100%"></div>
</div>
</body>

它没有显示任何东西。我该如何解决这个问题？

【问题讨论】：

【解决方案1】：

这是因为height: 100%; 是always relative to the parent's height。在您的情况下，这是无名 div，其高度为零，因此 #map_canvas 将是 100%，仍然为零。所以谷歌地图不会显示，因为 div 没有可见的高度。

如果您在父 div 上指定 100%，它将再次起作用。我猜你已经有了html, body { height: 100%; }，如果它只是在body标签中工作的话。

【讨论】：

【解决方案2】：

你有没有 html，body 也是 100%？

html, body, #map_canvas { margin: 0; padding: 0; height: 100% }

【讨论】：