Bootstrap'da 3 resim arasına boşlık bırakma nasıl oluyor

Bu konuyu okuyanlar

mali2012

Asistan
Katılım
10 Eylül 2012
Mesajlar
157
Reaksiyon puanı
9
Puanları
18
Merhabalar. Ben 3 tane resmi yanyana koymak istiyorum. Her resme col-lg-4 verdim. Genişlikleri 100% olacak şekilde ayarladım. Aynen resimde olduğu gibi görünüyor.
Benim istediğim ise aralarında biraz boşluk bırakabilmek. col-lg-3 yapsam çok boşluk kalıyor. Yardım edebilirseniz sevinirim
resim.jpg
.
Mesaj otomatik birleştirildi:

Bu 3 resmi kapsayan
Kod:
div
deki
Kod:
no-gutters
kodunu silince, ortadaki ve sağdaki resme
Kod:
padding-left:5px;
verince tam olarak oturdu.
Mesaj otomatik birleştirildi:

Bu arada teşekkür ederim yine de. Cevaplayacaktınız zaten. :)
 
Son düzenleme:

mali2012

Asistan
Katılım
10 Eylül 2012
Mesajlar
157
Reaksiyon puanı
9
Puanları
18
Arkadaşlar vallahi bu sorunumun cevabını yeni öğrendim. Paylaşayım dedim. Yukarıdaki problemi şöyle çözebiliyormuşuz: "row" classı'ndan sonra "col" kullandığımız vakit, kendisi otomatikman boşluk veriyor. Bu sorunda böylece çözüldü. :):D


<div class="row">

<div class="col">
<div class="card ilk-kart">
<img src="images/kucuk-slider/slider-1.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>


<div class="col">
<div class="card ikinci-kart">
<img src="images/kucuk-slider/slider-1.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>


<div class="col">
<div class="card ucuncu-kart">
<img src="images/kucuk-slider/slider-1.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>

</div
 
Üst