Relative div with absolute images

No, I think you are misunderstanding the technique a little here :slight_smile:

The aspect ratio is maintained wholly by the padding technique so the image needs to be width:100% and height:100%. The image ratio will be correct as long as you have matched it with the padding that is being used. (To be fair if you have correctly managed the aspect ratios then height:auto would also work but in essence is not part of the technique.)

If all the image aspect ratios are not all the same then of course the image will be stretched or squashed which is what I have been mentioning a few times now.

If the aspect ratio for the images are not all the same and you set height:auto on the image the image will either be smaller or taller than the padding box you are using and thus leave a gap or overflow the container.

Isn’t that what I just said.:wink:

1 Like