Question

我有谷歌地图和设计（iphone），我想显示地图洞察电话＆＃39;。点击底部按钮后，手机会变大，谷歌地图也会根据手机的当前大小增长。

由于某种原因，宽度很好但不是高度。如果我使用px或％作为高度，根本没有显示任何内容以及它现在如何，它也不起作用。有谁知道为什么？我可以包括一个jsfiddle，如果那更好＆＃34;谢谢。

HTML：

<article id="devices">
    <div id="device" class="iphone">
        <div id="devicetop" class="iphone-speaker">
        </div>
        <div id="screen" class="iphone-screen">        
                    <div id="map-canvas"></div>

            </div>
            <a href="#">
                <div id="button" onclick="ipadSwitch()">
                     <div id="button-square">
                    </div>
                </div>
            </a>
        </div>
</article>

的CSS：

  #map-canvas {
  width:100%;
  height: 100%;

 }
#screen {
  background-color: #c5c3ba;
  margin: 0 auto 0;
  border: 0.189em solid #aba99f;
  border-radius: 0.189em;
  width:10.08em;
  height:17.892em;
}

Answer 1

您必须为父div提供宽度和高度才能在子div上将宽度/高度设置为100％，在本例中为#map-canvas

CSS - 如何使谷歌地图的大小与周围的div一样大？

1 个答案: