子元素给了position:absolute;父元素的高没有

Question

         <div class="banner">
            <div class="div">
                <a>
                    <img src="img\Slider-2.jpg" alt="">
                </a>
            </div>

            <div class="div">
                <a>
                    <img src="img\Slider-3.jpg" alt="">
                </a>
            </div>

            <div class="div">
                <a>
                    <img src="img\Slider-4.jpg" alt="">
                </a>
            </div>
        </div>

.banner{
    position: relative;
}
.div{
    position: absolute;
    width: 100%;
}

子元素是有高的，我清处了浮动也没用。我现在想做的一个效果是，图片能自适应而且.banner的高度也是自适应，而且3张图片要重叠在一起。求各路大神求解。

Answer 1

子元素绝对定位,脱离文档流,所以父元素高度为0,

Answer 2

浮动之后  父元素没有东西撑开 所以就是0

Answer 3

要重叠的话，就用z-index层级控制

Answer 4

给图片一个100%的宽

Answer 5

父元素没有高 100%依旧是0要重叠在一起就设置宽高 设置left和top啊