Question

I have two images on a page. The first image has position:relative and the second image is right under the first image with position:absolute. Is it possible to align the second image with the other one so that their relative positions remain the same as you zoom in or out?

Answer 1

If you zoom with your browser, crashing elements position is an ordinary situation. So I’d not advise you to pay so much attention to it. But in any case your images must have the same parent, that has “position: relative”.

HTML

<div class="myImageContainer">
    <img class="positionedRelative" src="" alt="" />
    <img class="positionedAbsolute" src="" alt="" />
</div>

CSS

.myImageContainer { position: relative; }
img.positionedRelative { position: relative; } /* not necessary, try to remove */
img.positionedAbsolute { position: absolute; left: 0; top: 0; }

left: 0; top: 0; – insert your own values.