Flexbox tiene este comportamiento donde estira las imágenes a su altura natural. En otras palabras (más específicas), si tengo un contenedor flexbox con una imagen secundaria y cambio el tamaño de esa imagen, la altura no cambia de tamaño y la imagen se estira.

<div>
    <img src="https://loremflickr.com/400/300" >
    <h4>Appify</h4>
    <p> some text </p>
</div>

Y esta hoja de estilo

div {
  display: flex; 
  flex-wrap: wrap;
}
img{ 
  width: 50%
}

yo añadíEste codepen para demostrar lo que quiero decir. ¿Qué causa esto?