I came here looking for an answer to my distorted images. Not totally sure about what the op is looking for above, but I found that adding in align-items: center
would solve it for me. Reading the docs, it makes sense to override this if you are flexing images directly, since align-items: stretch
is the default. Another solution is to wrap your images with a div first.
.myFlexedImage {
display: flex;
flex-flow: row nowrap;
align-items: center;
}