嵌入 Google 我的地图 - 页面居中答案

【问题标题】：Embeded Google My Map - Center on Page嵌入 Google 我的地图 - 页面居中
【发布时间】：2015-12-05 02:21:36
【问题描述】：

对于有 2 个地点的企业，我不得不更改为嵌入式“我的地图”。这样做时，我无法像以前那样设置地图的高度和宽度。这不是什么大问题。但我无法在页面上居中地图。我该如何做到这一点？

新的 HTML 不能正常工作：

<div class="fluid-wrapper hidden-phone" style="text-align: center;">
<iframe style="border: 0;" src="https://www.google.com/maps/d/embed?mid=zuwjqCdHTFSc.koi0qAWQnX34" width="850" height="500" frameborder="0"></iframe>

正在运行的旧代码：

<div class="fluid-wrapper hidden-phone" align="center">
<iframe style="border: 0;" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d105844.34381467322!2d-84.5165869!3d34.0018888!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x88f56b7fceeae357%3A0x621d85f56e1d8376!2sCherokee+Collision+Center!5e0!3m2!1sen!2sus!4v1423686645744"
width="850" height="500" frameborder="0"></iframe>

嵌入地图网址：http://www.cherokeecollisioncenter.com

【问题讨论】：

标签： html google-maps joomla

【解决方案1】：

将以下样式添加到.fluid-wrapper iframe

margin: 0 auto;
left: 0;
right: 0;

您的代码的问题是您没有样式right:0，因此它只使用了left:0。而且，margin:0 auto; 将使它居中，没有边距。

【讨论】：