html - 固定 div 绝对定位被放置在图像下

Question

我有一个图像和一个我想放在容器上的小容器，但它在图像下方设置了这个“.innerimage”。

不建议使用 top: xx; 因为在我的实际元素中我有很多具有相同类的 div，我不能使用 top 否则它会搞砸。

<div id="page">

    <div class="image">
        <img src="http://upload.wikimedia.org/wikipedia/commons/8/85/Black_300.jpg">
            <div class="innerimage"></div>
    </div>

</div>

Answer 1

如果我很了解你的需要，如果你不需要support IE7 ，也许你可以使用 display:table 和 display:table-caption

我用这些 CSS 属性更新了 JSFiddle:

http://jsfiddle.net/ZhdMj/1/