html - Position div under absolute div with responsive design

Question

I'm struggling with this "simple" problem:

I have multiple images that I need to overlap precisely, so I'm using position: absolute and z-index. I need this div centered horizontally and responsively adjusting to fullscreen

.images {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative; 
    height: auto;
}

.image {
    width: 100%;
    margin: auto;
    position: absolute;
}

The images are overlapping and displaying correctly, but they seem to have no height. The next div just displays over it, even when I use "relative" as a wrapper for both. With minimum height set, the images won't adjust dynamically.

I've been googling for several hours now and can't find any working solution. I'd be glad for any help provided.

question from:https://stackoverflow.com/questions/65832108/position-div-under-absolute-div-with-responsive-design

Answer 1

Waitting for answers