Bootstrap 5 Mobilde İkili Kutu Nasıl Yapılır?

yone1108

Decapat
Katılım
21 Nisan 2021
Mesajlar
709
Makaleler
1
Çözümler
2
Merhaba, web sitesi tasarlıyorum ancak şöyle bir sorunum var.
Bilgisayarda col-md-3 ile bu şekilde 4 adet yan yana listeledim burada sorun yok ancak mobile geçtiğimde alt alta listeliyor. Benim istediğim mobilde yan yana 2 kutu olsun aşağıdaki kutu kırmızı ile işaretlediğim alanda olsun istiyorum ancak tek tek alt alta listeleniyor.



Bilgisayarda 4 adet kutu böyle sıralanıyor sorun yok.
 
HTML: 
<div class="col-md-12">
    <div class="row">
        <div class="col-md-3 my-2">
            <div class="card" style="width: 16rem;">
                <img src="tema/dron.jpg" class="card-img-top p-5" alt="...">
                <div class="card-body">
                    <p class="card-text">Cx007 Zoom Pro Smart Drone 2 Bataryalı CRB-044</p>
                    <h6>749₺</h6>
                </div>
                <div class="card-footer border-0">
                    <div class="text-center">
                        <button class="btn btn-sm btn-light border-1 fw-bold px-5"><i class="fa-solid fa-cart-shopping"></i> SATIN AL</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

bu şekilde kod satırım
 
Kod: 
<div class="col-md-3 my-2">
kısmını şu şekil yap
Kod: 
<div class="col-6 col-md-3 my-2">
 
meakJK dedi:
Kod: 
<div class="col-md-3 my-2">
kısmını şu şekil yap
Kod: 
<div class="col-6 col-md-3 my-2">
Genişletmek için tıkla...

Çok teşekkür ederim oldu ancak şöyle bir sorun daha var boyutlar aynı kalıyor mobilde küçülsün istiyorum bunu nasıl sağlayabilirim?



üst üste bindi bu şekilde
 
Konuyu cevapla
Menü
Giriş yap
Kaydol
Bu siteyi kullanmak için çerezler gereklidir. Siteyi kullanmaya devam etmek için çerezleri kabul etmelisiniz. Daha Fazlasını Öğren.…