Foros del Web - Ver Mensaje Individual

abimaelrc · #2 (**permalink**) 07/04/2011, 05:27

Debes colocar el div que añades el mapa arriba y luego el div del formulario. Algo así

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>test</title>
    <style>
    *{ margin: 0; padding: 0; }
    html, body, #map{
        width: 100%;
        height: 100%;
    }
    #formContent{
        position: relative;
        top: -50px;
        width: 300px;
        margin: 0 auto;
    }
    .submit{ padding: 3px 5px; }
    </style>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;language=es"></script>
    <script type="text/javascript">
    window.onload = function(){
        var popup;
        var n=1;
        var options = {
            zoom: 9
            , center: new google.maps.LatLng(18.2, -66.5)
            , mapTypeId: google.maps.MapTypeId.ROADMAP
        };
     
        var map = new google.maps.Map(document.getElementById('map'), options);
    };
    </script>
</head>
<body>
    <div id="map"></div>
    <div id="formContent">
        <form action="#">
            <input type="text" name="foo" />
            <input type="submit" class="submit" value="submit" />
        </form>
    </div>
</body>
</html>