2

我只想移动右侧的 HTML 表单（在地图下）。我尝试使用align="right"但没有任何变化。这是我的完整代码。您可以运行它来查看它的外观：地图显示也很奇怪，但这是另一个问题。

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Finding the best location</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.4/leaflet.css" />
<!--[if lte IE 8]>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.4/leaflet.ie.css" />
<![endif]-->

<script src="http://cdn.leafletjs.com/leaflet-0.4.4/leaflet.js"></script>


    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>

</head> 

<body> 
<div data-role="page">
<div data-role="header">
<div data-role="content" >

        <h1>Location suitability application</h1>
    </div><!-- /header -->
    <div id="mymap" style="height:300px;width:700px""></div>            

<form name="theform" >
        <table width="600"> 
        <tr>
            <td width="400" align="left">

            <td width="9"> 
            <td width="224"> 
            <b>Business importance factor:</b>
            <SELECT name="busfac"> 
            <OPTION selected value="1">1</OPTION>
            <OPTION value="2">2</OPTION>
            <OPTION value="3">3</OPTION>
            <OPTION value="4">4</OPTION>
            <OPTION value="5">5</OPTION>

            </SELECT>
        </tr>

        <tr>
            <td width="154" align="left">
            <td width="9">
            <td width="224">
            <b>Neighborhood importance factor:</b>
            <SELECT name="neifac">
            <OPTION selected value="1">1</OPTION>
            <OPTION value="2">2</OPTION>
            <OPTION value="3">3</OPTION>
            <OPTION value="4">4</OPTION>
            <OPTION value="5">5</OPTION>
            </SELECT>
        </tr>

        <tr>
            <td width="154" align="left">
            <td width="9">
            <td width="224">    
            <input type="button" Value="Store point" 
            onclick="insertW(this.form.busfac.value,this.form.neifac.value);"/>
        </tr>

        <tr>
            <td width="154" align="left">
            <td width="9">
            <td width="224">    
            <input type="button" Value="Calculate best location" 
            onclick="nese(handleLoc);"/>
        </tr>
        <tr>
        <td width="154" align="left">
            <td width="9">
            <td width="224">    
            <p> Your Latitude is: <b id="C1" name="Latitude"> </b> </p>
            <p> Your Longitude is: <b id="C2" name="Longitude"> </b> </p>
        </tr>
        </table>




        <td width="154" align="left">
            <td width="9">
            <td width="224">    
            <input type="hidden" name="gjer" id="gjerId" />
        </tr>

        </form>

        <script>


function mark(p) {
theMarker=new L.Marker(p);
map.addLayer(theMarker);
theMarker.bindPopup("You are here");
}

function handleLoc(pos)  {
var a=pos.coords.latitude;
var b=pos.coords.longitude;
var p = new L.LatLng(+a, +b);
mark(p);
document.getElementById("C1").innerHTML;
document.getElementById("C2").innerHTML;
}



function handleErr(pos) {
document.write("could not determine location");
}

if (navigator.geolocation) {
navigator.geolocation.watchPosition(handleLoc, handleErr);
} else {
document.write("geolocation not supported");
}

var map = new L.Map('mymap');
var osmTile = "http://tile.openstreetmap.org/{z}/{x}/{y}.png";
var osmCopyleft = "Map data &copy;2012 OpenStreetMap contributors";

var osmLayer = new L.TileLayer(osmTile, {
    attribution: osmCopyleft
});
map.addLayer(osmLayer);
map.setView(new L.LatLng(41.33,19.8), 13);


    </script> 
        </div><!-- /content -->
        <div data-role="footer">
        <h4>Page Footer</h4>
        </div>
    </div>  
</body>
</html>
4

1 回答 1

0

在您的CSS文件中，尝试：

float: right;
于 2012-08-13T13:56:01.037 回答