google maps en jquery mobile

Al mostrar un mapa de Google en jquery mobile, parece (después de leer los foros) que se requiere un código como el siguiente:

<div data-role="page" data-theme="b" class="page-map" style="width:100%; height:100%;">
    <div data-role="header"><h1>Map Page</h1></div>
    <div data-role="content" style="width:100%; height:100%; padding:0;"> 
        <div id="map_canvas" style="width:100%; height:100%;"></div>
    </div>
</div>

Al quitar la altura del div externo, el div cae a la altura 0 y el mapa no se muestra. Esperaba obtener un texto dinámico debajo del mapa (basado en el contenido del) qué longitud no conozco, por lo que no puedo establecer una altura absoluta. ¿Alguien tiene una solución para este problema?

Respuestas a la pregunta(4)

Su respuesta a la pregunta