Wie stelle ich eine Karte so ein, dass sie in einem anderen Div liegt?

Ich bin ein Neuling in Javascript und benötige Ihre Hilfe beim Einstellen einer Google Map auf ein div-Element, das sich in einem anderen div-Element befindet. Hier ist der Code, der funktioniert, wenn die div-Elemente nicht verschachtelt sind:

function initialize() {

var myOptions = {
    center: new google.maps.LatLng(-34.397, 150.644),
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);

Wenn ich verschachtelte Divs habe, funktioniert das jedoch nicht:

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

Wie löse ich dieses Problem?

Antworten auf die Frage(2)

Ihre Antwort auf die Frage