Sayfa ile kayan sidebar kartları yapımı?

rephp7 1227 gün önce

812 defa görüntülendi

Bootstarp4 ile yazdığım sayfama sağ tarafa bu şekil bir sidebar katmak istiyorum ama sayfa orta kısım uzun ve bu aşağıdaki sağ sidebar kutucuğunun da sayfa ile aşağı kaymasını istiyorum bunu nasıl yapabilirim ?

<!-- rightside-->
<div class="col-md-2 col-sm-6 col-xs-6">
    
<!-- kutucuklar -->
<div class="cols-md-3 g-4  mb-3 ">
    <div class="col">
        <div class="card h-100">
            <div class="card-body">
                <a href="" class="nav-link">
                <h5> Kart Başlığı</h5>

                <small class="text-muted cat">
                    <p class="card-text h6">
                      Kart Açıklama metni...
                    </p>
                </small>
                </a>
            </div>
        </div>
    </div>
</div>
<!-- ./ kutucuklar -->

</div>
<!--rightside end-->

html

Soru hatalı mı? 👎

Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!

Spam olarak işaretle

Cevaplar (3)

fatihozpolat

1227 gün önce

sticky-top yapınca top değerini 0 alıyor olmalı örneğin navbarın yüksekliği 70px ise css ile top:70px gibi bir değer verirsen en üstten 70px aşağıda yapışacaktır.
direk

<div class="cols-md-3 g-4 mb-3 sticky-top" style="top:70px">

bu şekilde inline yazabilirsin.

#006557

mami

1227 gün önce

bootstrap'ın sticky-top classında z-index özelliği 1020 olduğu için,
ya navbara daha yüksek değer vereceksiniz
yada sticky-top verdiğiniz elemanına style'ına z-index: 1; vereceksiniz.
iyi günler.

#006553

rephp7

1227 gün önce

<div class="cols-md-3 g-4 mb-3 sticky-top "> şeklinde div class'a sticky-top ekledim oldu ama bu defa da navbar'ın da üzerine çıkıyor.

#006552