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>
en kolayı bootstrap'ta classa sizing değeri atamak
örnek
h-25 d-inline-block h ibaresi yukardan aşağıya temsil eder yüzde 25% boyutlandırılır
örnek
w-25 d-inline-block w ibaresi sağdan sola temsil eder yüzde 25% boyutlandırılır
ayrıca boşluk atamak içinde yine classa
mt-0
mb-0
ml-0
mr-0
my-0
t- değer margin-top veya padding-top
b- değer margin-bottom veya padding-bottom
l- değer margin-left veya padding-left
r- değer margin-right veya padding-right
x- her ikisini de ayar -left ve -right
y- her ikisini de ayar -top ve -bottom