画像を歪ませずに、異なるサイズの画像で応答性の高い画像ギャラリーを作成するにはどうすればよいですか？私が解決しようとしている問題の

Question

DEMO：https://www.bootply.com/GcLnOddfEZ

だから、また、それらを維持しながら（まあ、少なくともあまりない）私の画像は、異なるサイズのであり、私は彼らがオリジナルの画像を歪ませることなく同じサイズに見えるようにしたいとしますすべて応答します。この問題についてはどうすればいいですか？

Answer 1

は何をしたい、このです：jsfiddle.net

.img-cont { 
    height: 300px; 
} 

img{ 
    display: block; 
    width: 100vw; 
    height: 100vh; 
    max-width: 100%!; 
    max-height: 100%!; 
    object-fit: cover; 
}