谷歌地图 api - 地图上的奇怪 div答案

【问题标题】：Google maps api - strange div over map谷歌地图 api - 地图上的奇怪 div
【发布时间】：2016-06-07 22:13:01
【问题描述】：

我将地图添加到我的网站，但它有问题。这就是发生的事情......

这是html

<div id='map'>

    </div>
        <script async defer
                src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDNnZ9kGQCZbjbUAceQXwxW9TBHxV2tNlU&callback=initMap"></script>

这是我的 JS 代码...

function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 15.177076, lng: 15.619812},
    zoom: 8
  });
  }

我还发现这个白色 div 属于“gmnoprint”类，并且我为该类设置了 display: none。在该元素后面有一个 div 元素，其中包含指向谷歌地图的链接。

那个 div 也遍布我的地图，它阻止我控制地图，但它不包含 class 或 id 属性。

有什么问题？如果没有其他解决方案，我可以通过什么方式更改该元素样式（我应该使用哪些 CSS 选择器）？

看起来像这样……

【问题讨论】：

真的很奇怪。你有完整的代码示例来重现这个吗？
地图的所有代码都在这里。我设法通过隐藏第一个白色 div 并为包含谷歌链接的第二个 div 设置 height: auto; width: auto 来解决这个问题（div 高度和宽度由谷歌链接的高度和宽度设置）。仍然不知道是什么问题，但我找到了避免它的方法
真的很奇怪，因为我可以看到左上角的谷歌图标。它必须在左下角。据我所知，禁止根据 ToS 更改归属位置。您确定不覆盖默认样式吗？
是的，我完全确定。在我为 div（包含 google 链接）添加样式 width: auto; height: auto 后，google 链接位置在左下角

标签： javascript html css google-maps-api-3

【解决方案1】：

http://www.w3schools.com/googleapi/google_maps_basic.asp

试试这个。它对我有用。

这是一种将地图添加到您的网站的更快方法。相同的功能：

【讨论】：

【解决方案2】：

我也遇到了同样的问题。

我发现它在我的 CSS 中。

我有一个规则适用于嵌套在两个元素中的所有 div，如下所示：

anElement AnOtherElement div
{    
    position: relative;
    top: 0px;
}

这个 div 嵌套在这两个元素中，因此应用了规则并将这个 div 和另一个 div 拉伸到地图的顶部。

Streched div

【讨论】：