Question

到目前为止，文本居中，谷歌地图页面左侧拥抱，然后它下面的文字保持居中，我只想让地图居中。

<div id="row1">
    <div id="note"><img src="http://www.bristol.gov.uk/sites/default/files/styles/hero_image/public/images/children_and_young_people/resources_for_professionals/head_teachers_and_school_administrators/hr/contact_us/we%20will%20be%20back%20soon-sticky%20note.jpg?itok=08vLR_lO"></div>
    <div id = "hours">
        Sorry<br>
        hours<br>
    </div>
    <div id="gmap_canvas" style="height:500px; width:600px;"></div>
    Below text
</div>

风格：

#row1 {
    text-align: center;
}

Google Map JavaScript：

<script type="text/javascript">
function init_map() {
    var myOptions = {
        zoom: 16,
        center: new google.maps.LatLng(20.0820037, -14.26733380000002),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("gmap_canvas"), myOptions);
    marker = new google.maps.Marker({
        map: map,
        position: new google.maps.LatLng(20.0820037, -14.26733380000002)
    });
    infowindow = new google.maps.InfoWindow({
        content: "<b>Crokson Dine In</b><br/>43 Gill Rd<br/>09521 Hovill"
    });
    google.maps.event.addListener(marker, "click", function() {
        infowindow.open(map, marker);
    });
    infowindow.open(map, marker);
}
google.maps.event.addDomListener(window, 'load', init_map);
</script>

Answer 1

text-align: center无法将块元素本身居中。您需要自动边距：

<div
    id="gmap_canvas"
    style="height:500px; width:600px; margin-left: auto; margin-right: auto;">

如何将我的谷歌地图脚本与div中心？

1 个答案: