css - 更改街景小人在 Google map 上的位置

标签 css google-maps-api-3

我已经使用以下小屏幕 css 成功地移动了 Google map 上的所有其他控件:

div.gmnoprint, div.gmnoprint:nth-child(8) > div:nth-child(2) > div:nth-child(4) > img:nth-child(1) {
  padding-top: 130px;
}

在网站的移动/小屏幕版本上,需要将 map 控件移动到 Logo 下方。平移、缩放和 map 类型控件都可以正确移动,但 Peg Man 停留在站点 Logo 后面的原始位置(我不能轻易移动)。

上述 css 中使用的元素标识符是 Firefox 检查器声称的 Peg Man 图像,但我也尝试从该标识符的末尾删除 weekend 以修改 div 标签而不是图像 - Peg Man 只是不会动!

您可以在 http://www.BlueBadgeParking.com 查看问题在屏幕尺寸小于 400 像素的设备上。

最佳答案

您必须为 pegMan 使用 margin-top 而不是 padding-top 因为包含街景小人的 div 的高度为 0。

#map-canvas > div > div:nth-child(8) > div:nth-child(2){
margin-top: 19px;
}

在您的网站上测试。

关于css - 更改街景小人在 Google map 上的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23405271/

相关文章:

html - 如何创建两个与标题并排的表格?

google-maps-api-3 - 访问融合表

css - 属性名称前的井号 - CSS 浏览器 hack?

css - 如何沿对 Angular 线重复背景(每行仅 1 次)

javascript - 带有可点击侧边栏的 Google map

javascript - 谷歌地图 API 3 removeListener 不工作/行为怪异

javascript - 如何在街景模式下像 Marker 一样显示 google.maps.Circle?

google-maps-api-3 - 设置可见后markercluster不变

html - 缩略图不会在 twitter bootstrap 2.3.2 中居中

html - 我如何在 Laravel 中将视频背景作为横幅添加到我的网站?