RoiEX RoiEX - 4 months ago 18
CSS Question

Place div containing an image with undefined size at bottom of another div

I have the following Problem: I have a slideshow using JScript wich changes the image every couple seconds...

The image sizes may vary and therefore I created a frame containing the Image-Frame in order to prevent the rest of the Page moving up and down:



.slideshow-container {
max-width: 1000px;
margin: auto;
position: relative;
}
.frame {
height: 900px;
}
.slideshow-container img {
width: 100%;
}

<div class="frame">
<div class="slideshow-container">
<img href="exampleImage.png">
</div>
</div>





The inner div has the size of the image, which is supposed to be like that, but now I want the inner div with the image to be at the bottom of the outer div while maintaining it's size.

Any ideas?

Answer
    .frame  {
        position: relative;
    }

    .slideshow-container {
        position: absolute;
        bottom: 0;
    }