来自溢出的CSS怪异：隐藏

Question

至少我认为它来自溢出隐藏。

我有一堆div作为内联块。它们每个都有一个大于设置50x50的图像，具有溢出隐藏设置。有时在加载时，图像不能很好地解决：

但如果我右键点击检查元素，它会立即解决（Chrome）。 Safari有类似的行为。

预期结果：

HTML：

<div id="thumb_overlay">        
            <div class="active">
                <img src="1.jpg" data-src="a.jpg">
            </div>

            <div>
                <img src="2.jpg" data-src="b.jpg">
            </div>

            <div>
                <img src="3.jpg" data-src="c.jpg">
            </div>


            ... etc
</div>

的CSS：

#thumb_overlay {
position: absolute;
bottom: 5px;
right: 5px;
text-align: right;
background-color: rgba( 255, 255, 255, .5);
padding: 5px 5px 0 5px;
}

#thumb_overlay > div {
display: inline-block;
width: 50px;
height: 50px;
overflow: hidden;
}

#thumb_overlay img {
opacity: .9;
cursor: pointer;
}

Answer 1

尝试将其作为显示：阻止并将它们彼此相邻而不是内嵌它们，我在绝对定位方面遇到了类似的问题，并且让浏览器自动定位它们似乎会停止鼠标悬停问题。