无法将Google Maps Iframe集中到WordPress主题的PHP部分文件中

Question

我将Google Maps Iframe插入WordPress主题的PHP部分文件中。尝试了多种方法将其集中。到目前为止什么都没有！你能帮忙吗？

这是外观：http：//prntscr.com/hjyd4s

     <div class="home-section-content
<!--
<div id="google-maps">  <!-- <div style=" margin:auto; ">
<style type="text/css"> 
#google-maps  {
mar gin: auto;
width: 125%;
border: 3px solid #73AD21;
padding: 10px;
margin-left: auto ;
margin-right: auto ;
}       
</style>
-->
            <br><br><br>
    <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2989.608839663209!2d-8.163739!3d41.4693985!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd24e87671374bf1%3A0x9a3a665c9521b5a4!2sR.+de+S%C3%A3o+Mateus+193%2C+4820-500+Ascens%C3%A3o!5e0!3m2!1sen!2spt!4v1511832699133" 
     width="1400" height="800" ali gn="center" frameborder="0" style="border:0" allowfullscreen></iframe>
        </div>

我评论了您看到的那件代码，因为它不起作用。但是您可能会指出为什么？

Answer 1

如果将id="google-maps"放在iframe本身上，则更容易中心。

    <style type="text/css"> 
    #google-maps  {
      display: block;
      margin: 10px auto;
      border: 0
    }    
    </style>
    <div>
        <iframe id="google-maps" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2989.608839663209!2d-8.163739!3d41.4693985!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd24e87671374bf1%3A0x9a3a665c9521b5a4!2sR.+de+S%C3%A3o+Mateus+193%2C+4820-500+Ascens%C3%A3o!5e0!3m2!1sen!2spt!4v1511832699133" 
         width="1400" height="800" frameborder="0" allowfullscreen></iframe>
    </div>