谷歌地图api v3 infobubble css火狐

Question

我有一些文字和图像的infoBubble。右对齐的图像（箭头）在Firefox（Mac）中被按下，但不是Safari或Opera，这取决于左侧和上方的文本长度。见标记超过澳大利亚：http://www.hostelbars.com/map_test_v3_3.html

这里的CSS：

.infowindow { 
    background-color: #000; 
    color: #FFF; 
    font-size: 18px; 
    font-family: Helvetica Neue, Helvetica, Arial; 
    text-shadow: 0 -1px 0 #000; 
    font-weight: bold; 
    position: relative; 
    overflow: hidden; 
} 
.infowindow .iwPhoto { 
    background-color: #F00; 
    position: relative; 
    padding-bottom: 1px; 
    padding-top: 2px; 
    padding-left: 5px; 
} 
.infowindow .iwName { 
    background-color: #0F3; 
    line-height: 33px; 
    white-space: nowrap; 
    position: relative; 
    margin-left: 115px; 
    margin-top: -70px; 
    padding-right: 5px; 
    padding-top: 2px; 
} 
.infowindow .iwCity { 
    background-color: #C03; 
    line-height: 32px; 
    margin-left: 115px; 
    padding-bottom: 1px; 
} 
.infowindow .iwCity .iwArrow { 
    background-color: #0CF; 
    padding-right: 5px; 
    padding-left: 5px; 
    margin-top: 3px; 
    float: right; 
} 

从我不想div的有一个固定的宽度图像

除了。希望得到一些帮助。

布兰顿

Answer 1

似乎只发生在第一时间，并与城市价值超过名称值长项。这表明你没有为你的img元素（arrow.png）设置width和height值，所以它第一次不知道它将会是多大，以及它后来的时间。

你应该做的是将其更改为背景图像，因为它只是一个图标化的装饰图像，意思是“下一个”或“多”，因此应在风格 CSS的境界，而不是HTML的的境界意思是（其中'img'居住）。见this list of image replacement techniques。

否则，您可以仅应用img[src$="arrow.png"] { width: 29px; height: 29px; }，或将width和height属性添加到img元素。