Image pile with position absolute

Question

I've created a pile of images on which you click through. By clicking the top image it moves the z-index back by the amount of images. These images need to have a shared description. If I put position:absolute on them (to stack them). The description also gets stacked. Is there a way to keep them it under the images?

.image-pile {
    position: relative;
}

.images img {
    position: absolute;
    width:300px;
}

https://jsfiddle.net/td59pr1h/

Answer 1

The .image-pile had no height because the content was positioned absolute. Fixed it by calculating the height in javascript.

var imgheight = $( ".images img" ).innerHeight()

$('.images').css('height', imgheight)