wordpress页面中的Google地图样式问题

Question

我有一个奇怪的问题，把谷歌地图放在wordpress页面-缩放滑块似乎只有一半可见(请看图片)我认为这是与wordpress的样式覆盖谷歌地图css有关，有人知道如何解决这个问题吗？

提前感谢！

编辑:对于任何有同样问题的人，我在这里找到了解决方案：Google Maps zoom control

​

​

Answer 1

仅仅通过看这张图片很难弄清楚这里发生了什么。最好的做法是提供一些CSS、jsfiddle链接或指向有问题的页面的链接。

我建议使用Firebug之类的工具，或者Chrome的web开发工具。然后，以有问题的元素为目标，检查添加到它的CSS属性的类型，这些属性改变了它的显示方式。然后，您可以使用自己的!important覆盖它们，以便它们优先于现有的。

例如，假设您有一个如下的属性：

img {
    padding: 5px;
}

这将为页面中的所有图像添加一个5px的填充。为了更改特定元素的属性，您可以尝试将其作为目标，并使用!important规则更改相关属性。假设元素的ID为“某个元素”。然后，您可以更改违规属性，如下所示：

#someelement {
    padding: 0;
}

在上面的示例中，我们不需要!important，因为在ID上设置的属性比在小部件类型上设置的属性具有更大的特异性。如果要对页面中的所有图像覆盖此规则，可以执行以下操作：

img {
    padding: 5px !important;
}

这里需要!important标志，因为您的规则与原始规则具有相同的特异性。

有关CSS优先级规则(包括特异性和!important)，请在此处进行检查：

http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/

Chrome开发者工具已经和Chrome捆绑在一起了。对于Firefox，您可以在此处获取Firebug：

https://getfirebug.com/