css - 环绕图像的 Div 具有超出过去图像的边框

Question

我不确定这个标题是否有意义，但我会尽我所能解释。

我想基本上在图像之上添加一个 div，这很简单。我将图像包裹在一个 div 周围，然后从中给出诸如 top:、left: 之类的内容。

然而，图像所在的这个 div 超出了实际图像的边界，并一直延伸到父 div。如何使 div 的边框围绕 div 内的实际图像。

黑色方块是图像。但是具有图像类的 div 没有环绕图像的边框。

<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

将 display: inline-block 添加到 .image div：

display: inline-block;

http://jsfiddle.net/wwRhB/4/