Tengo el siguiente problema y no logro solucionarlo o al menos creo que ya me confundí porque pensé que ya lo tenia, ya que si visualizo imágenes de la misma altura no hay problemas, pero si hay imágenes con un tamaño mas largo se sale del contenedor div.
Como se puede observar algunas imagenes con una altura mas grande se sale de contenedor. Como solucionara esto para que todos se vieran del mismo tamaño?
Mi código para visualizar las imágenes:
<div class="card" >
<div class="card-body">
<h5 class="card-title">Evidencias</h5>
<hr>
<div class="row" >
@foreach ($evidencias as $evidencia)
<div class="col-12 col-md-2" style="height:100px; margin-bottom: 10px;" >
<div class="card" style=" height:100%;">
@if($evidencia->url)
<a href="{{ url($evidencia->url) }}" target="_blank">
<img src="{{ url($evidencia->url) }}" class="card-img-top" style="height:100%;">
</a>
@endif
</div>
</div>
@endforeach
</div>
</div>
</div>