how to set the height of the parent that child img can set according to their parent without stretching img on all screens included zoom out

i set the max-height and max-width of parent div and same for the child div but when i zoom out the screen the images stretch.

if i fix the height on normal screen, it is ok. On zoom out its height is extra ordinary large.

I also use the media queries for all screen sizes.

can you help me to adjust the height of the images without stretching on all screen, including zoomout?