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>

和我使用sass的风格一样，这就是该代码结构的原因。

.headerCarrousel {
   min-width: 1024px;
}

.headerCarrousel img{
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;

}

.theStory{
    margin: 0 auto;
    text-align: center;
}

因此，由于某种原因，div“ theStory”位于div标头卡鲁塞尔的下面，但它们是重叠的。请注意，我必须将图像当作流畅的旋转木马，这就是为什么我要使用width：100％;

说明链接：http://marceloduende.com/tango/

有人对此问题有解决方案吗？谢谢。

最佳答案

问题解决了。

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

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

谢谢你们。

关于javascript - 宽度为100％时流体图像重叠div；，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/15049633/