Set Google Maps Container DIV width and height 100%

css, css-position, google-maps, google-maps-api-2, google-maps-api-3

Solution

You have to set all parent containers to a 100% width if you want to cover the whole page with it. You have to set an absolute value at width and height for the #content div at the very least.

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

div#content {
  width: 100%; height: 100%;
}

Problem

I loaded Google Maps API v3 and print Google Map in `div`. But when set width & height to 100% and auto I can't see the Map. Here is HTML code snippet. ``` <!-- Maps Container --> <div id="map_canvas" style="height:100%;width:100px;margin:0 auto;"></div> ``` Is there a way to fix this issue?

Original source