title: Google Maps is not displayed when I have a div before my map_canvas div
body: <p>I use Google Maps API v3 in a html file.</p>
  
  <p>The following code works:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Google Maps simple&lt;/title&gt;
      &lt;meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=no"&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;style type="text/css"&gt;
        html, body, #map_canvas {
          margin: 0;
          padding: 0;
          height: 100%;
        }
      &lt;/style&gt;
      &lt;script type="text/javascript"
          src="http://maps.googleapis.com/maps/api/js?sensor=false"&gt;&lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
        var map;
        function initialize() {
          var myOptions = {
            zoom: 8,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP
          };
          map = new google.maps.Map(document.getElementById('map_canvas'),
              myOptions);
        }
  
        google.maps.event.addDomListener(window, 'load', initialize);
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="map_canvas" align="center" style="width:60%; height:60% ; position: relative; background-color: rgb(229, 227, 223);"&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>But if I put one div before my map_canvas div, my google maps is not displayed.</p>
  
  <p>Example:</p>
  
  <pre><code>  &lt;body&gt;
    &lt;div id="layout"&gt;
      &lt;div id="toto"&gt;Hi everybody !!!!&lt;/div&gt;
      &lt;div id="map_canvas" align="center" style="width:60%; height:60% ; position: relative; background-color: rgb(229, 227, 223);"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;/body&gt;
  </code></pre>
  
  <p>Do you know why?</p>