Question

我正在尝试通过设置 margin-left 和 margin-right来对齐page中心的 div （用于Google地图） 到自动，但这仅适用于Firefox，但不适用于Internet Explorer：

<html>
<head>
<style type="text/css">
    h1,h2,h3,p { text-align: center; }
 #map { width: 700; height: 280; margin-left: auto; margin-right: auto; }
</style>
<script type="text/javascript"
 src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">

function init() {
    var latlng = new google.maps.LatLng(-34.397, 150.644);
 var opts = {
  zoom: 9,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
 };
 var map = new google.maps.Map(document.getElementById("map"), opts);
}

</script>
<head>
<body onload="init();">
<h3>Map</h3>
<div id="map"></div>
</body>
</html>

有人请知道，如何将IE中的 div 集中在一起？亚历

Answer 1

在任何事情之前使用doctype <!DOCTYPE HTML>来触发标准模式。

Answer 2

<html>
<head>
<style type="text/css">
    div#container { width: 700px; text-align: center; margin-left: auto; margin-right: auto; }
    #map { width: 700; height: 280; }
</style>
<script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">

function init() {
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var opts = {
        zoom: 9,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map"), opts);
}

</script>
<head>
<body onload="init();">
  <div id="container">
    <h3>Map</h3>
    <div id="map"></div>
  </div>
</body>
</html>

应该这样做。正如Meder所说：始终使用doctype！

div以Firefox为中心显示，但不在IE中显示

2 个答案: