I’m trying to align a div (used for Google Maps) in page center by setting margin-left and margin-right to auto, but this only works with Firefox, but not with 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>
Does anybody please know, how to center the div in IE as well?
Alex
Use a doctype,
<!DOCTYPE HTML>before anything to trigger standards mode.