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

如果我很了解您的需求并且您不必支持 IE7，也许您可​​以使用display:tableanddisplay:table-caption

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

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