Google Map 和 Bootstrap 冲突的地方

今天遇到一个诡异的问题(其实以前就遇到了,被我想办法绕开了):

在Google Map里添加一个Marker,如果Marker能够被拖动(draggable),就显示不正常。表现为一个1/3宽度的图标带2个阴影,拖动后变成1/4大小的图标。

反复尝试都无法解决,去查看了Gmap的源码,发现大家是一样的,也没能解决。最后还是Google之!

原来是Bootstrap的问题,它为了不让图片撑开容器,在样式里规定img { max-width: 100%};,就是这句话导致图片被压缩(应该是默认占据更宽的位置,好显示阴影之类的东西)。

修改我的样式,增加.map-container img { max-width: none; }之后,就一切正常了。

如果您觉得文章内容对您有用,不妨支持我创作更多有价值的分享:


已发布

分类

来自

评论

《“Google Map 和 Bootstrap 冲突的地方”》 有 1 条评论

  1. qee_wong 的头像
    qee_wong

    很好!顶下

欢迎吐槽,共同进步

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据