Перекрывающееся изображение в DIV

Question

У меня есть несколько div, которые содержат изображение, которое заполняет весь div:

<div class="callout">
    <img src="images/callout_image.gif" alt=""/>
</div>

.callout { float: left; width: 267px; height: 114px; }

Теперь я хочу поместить другое изображение в этот DIV, которое перекрывает часть исходного изображения и также «выскочит» из DIV, то есть оно выйдет за пределы размеров DIV, но сам DIV не расширяется. 1004 *

У меня проблемы с этим, кто-нибудь может помочь?

Answer 1

Примерно так:

<div class="callout">
    <img src="images/callout_image.gif" alt=""/>
    <img src="images/callout_image.gif" alt="" class="pop" />
</div>

.callout { float: left; width: 267px; height: 114px; position: relative;}
.pop {position: absolute; top: 50%; left: 50%; z-index: 1;}

Вам может потребоваться установить overflow: visible на div в зависимости от обстоятельств.