Front end basit margin yardım

Merhaba arkadaşlar ben web alanında yeniyim bootstrapi kavramaya çalışıyorum hâla, şimdi sitede bi sticky-navbar var z indexi 1030, bunun altında sectionlar başlıyor fakat ekran küçülünce navbar uzadığı için, alttaki contentle iç içe giriyor, benim istediğim ekran daraldığında alttaki section'a navbar boyutu + 50px margin-top vermek. Nasıl yaparım yardımcı olabilecek varmı?

Merhaba,

anladığım kadarıyla ara formlardan bahsediyorsunuz, pek önemli olmayan şeyler bu tür çözünürlükleri kullanan cihazlar olmaması sebebiyle. Css içerisinde media kullanımına gidebilirsiniz section classını kullanarak.

Örneğin;

@media only screen and (min-width: Xpx) and (max-width: Xpx)
{
.section-class {
margin-top: 50px;
}
}

Hocam cevabınız için çok teşekkürler fakat bu kod ile her genişliğe tek tek yazmam gerekiyor benim istediğim şu navbarın yüksekliği + 50px verelim ki her genişliğe göre otursun

Özellikle media kullanımında aralığı önerdim. Bootstrap kendine has responsive class mantığını kullandığından dolayı kolay kolay içerikte karışıklıklar olmaz ara formlar dışında. İsterseniz media da yalnızca max-width veya min-width değeri de verebilirsiniz. Olayı mı tam anlayamadım bilmiyorum, media kullanımının probleminizi çözmesi gerekli.

bende onu çözemedim olmaması gerekiyor normalde bakın ekran fotosu atım
Tam ekran;

Buda küçük ekran;

Hocam mobile navbar ekle düzeni bozuksa xs, sm classları içerisinde.

Deniyicem hocam teşekkürler şimdiden