google map 全屏CSS設定

google map 全屏CSS設定
Ivan Lee 寫於 2011年4月30日 3:15
#map-canvas {
bottom: 0;
height: auto;
left: 0;
position: absolute;
right: 0;
top: 0;
}

若設成
#map-canvas{
width: 100%;
height: 100%;
}
會出現空白頁, 若height指定px值, 則自動佔滿寛度.
可能成因,
http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/49cc3e330b0bafb2
the problem is that you've got a strict html doctype at the start, but the "hello world" example leaves out the doctype (and therefore runs in quirks mode). In strict mode the browser calculates the 100% height as zero (inherited from body) so you need CSS like this to see the map:


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