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;}