Javascript 宽度为100%时流体图像重叠div；

我试图弄明白为什么我的div被其他div重叠

标记看起来像

 <div  class="headerCarrousel">
    <img src="data/img/1_hero_carrousel/1.jpg" >
    <img src="data/img/1_hero_carrousel/2.jpg" >
    <img src="data/img/1_hero_carrousel/3.jpg" >
 </div>


 <div class="theStory">
    <p>aaaa</p>
 </div>

因此，由于某种原因，部门“theStory”位于部门标题下方，重叠。请注意，我必须将图像作为流体转盘，这就是为什么我使用宽度：100%

链接以说明：

有人能解决这个问题吗？谢谢。

问题解决了

为了解决这个问题，我必须使用jquery动态添加我的身高

$('.headerCarrousel')
.css('height', $('.headerCarrousel img').height());

谢谢大家

$('.headerCarrousel')
.css('height', $('.headerCarrousel img').height());