css de header da ufak bir kayma sorunu

Merhaba responsive yapmaya çalışıyorum fakat nav ın içi dağılıyor.HTML yapısından mı CSS den kaynaklı mı anlayamadım

css

.main-header {    width: 100%;    position: fixed;    top: 0;    left: 0;    background: darkorange;    padding: 0.5rem 1rem;    z-index: 1;}.main-nav__items{    list-style: none;    margin: 0;    padding: 0;}.main-nav__item{    display:inline-block;    margin: 0 1rem;}.main-nav__item a{    display:inline-block;    text-decoration: none;    font-weight: bold;    color: whitesmoke;    padding: 0.2rem 0;}

Yanlış yönlendirmek istemem fakat gözüme çarpan Position fixed oldu ondan kaynaklı olabilir. Absolute ve Relative olarak dener misiniz ?

@media only screen and (max-width: 300px) şeklinde bir query oluşturup nav a verdim hocam değişen bir şey yok.İletişim kısmı aşağı düşüyor yükseklik artıyor sliderin üzerine biniyor.

Şu responsive olayı insanı delirtir hakikatten hocam bir link gönderir misiniz ?

Merhabalar hocam, eğer sorununuz hala devam ediyorsa yardımcı olabilirim