Bootstrap Resim Sorunu
Boostrap ile bir tasarım yaptım.
Ama paylaştığım resimdeki gibi bir sorunum var. Dikey olarak eklediğim resimlerde boyut olarak hizalamada sorun çıkıyor. Height değerlerini aynı yaptığım zamanda görüntü doğal olarak bozuluyor. Bunu nasıl çözebilirim.
örn; https://i.hizliresim.com/mca51qa.jpg
Kullanım Şeklim:
<div class="py-5">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="main">
<div class="zoom-gallery">
<div class="slider slider-for center">
<div>
<a href="https://i.hizliresim.com/mca51qa.jpg">
<img class="d-block w-100" src="https://i.hizliresim.com/mca51qa.jpg">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
eğer carousel yapıyor isen bu düzeni kullan
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="..." alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="..." alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="..." alt="Third slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
daha fazla bilgi için göz atın hocam