Ustawienie identycznej wysokości dla obrazków w bootstrap

Question

Prosta galeria - 3 obrazki w rzędzie, jednakowa szerokość i wysokość. Szerokość działa, natomiast nie wszystkie wypełniają diva wertykalnie. Myślałem, że max-width: 100%; oraz height: auto; (https://getbootstrap.com/docs/4.0/content/images/#responsive-images) załatwią sprawę, jedno to nie to. Istnieje jakieś elastyczne rozwiązanie?

HTML

<div class="container">
        <div class="row">
            <div class="col-lg-4 col-sm-6 img-fluid"><img src=" https://images.unsplash.com/photo-1477209560495-270790f2251a?ixlib=rb-0.3.5&s=a6633a67cd06d6c076ff7ff40694274b&auto=format&fit=crop&w=750&q=80"></div>
            <div class="col-lg-4 col-sm-6 img-fluid"><img src=" https://images.unsplash.com/photo-1460891053196-b9d4d9483d9b?ixlib=rb-0.3.5&s=22c7eb6b9001fbe72e34fc55a8d12cab&auto=format&fit=crop&w=775&q=80"></div>
            <div class="col-lg-4 col-sm-6 img-fluid"> <img src=" https://images.unsplash.com/photo-1459666644539-a9755287d6b0?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=279b60ab483a2610d1e7260dc213898c&auto=format&fit=crop&w=828&q=80"></div>
        </div>
</div>

CSS

img {
      max-width: 100%;
      height: auto;
  }

 

Answer 1

https://jsfiddle.net/byv5aeow/ 

Jak dla mnie wszystko jest ok. Możesz przybliżyć problem ?