将绝对定位的div固定在图像下 [英] Fixing div with absolute positioning being placed under image

问题描述

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

I have an image and also a small container that I want to be placed on the container, but it sets this ".innerimage" below the image.

strong>不要建议使用top：xx; ，因为在我的实际项目中，我有很多divs与同一个类，我不能使用顶部或它会拧紧。

Do not suggest using top: xx; because in my actual project I have many divs with the same class and I can't use top or it will screw it up.

<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>

推荐答案

如果我很了解你的需要，不得不支持IE7 ，也许您可​​以使用 display：table 和 display：table-caption

If I well understand your need and if you don't have to support IE7, maybe you could use the display:table and display:table-caption

我更新了JSFiddle这些CSS属性：

I updated the JSFiddle with these CSS properties:

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

这篇关于将绝对定位的div固定在图像下的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！