مرحبا

لدي مشكلة في navigation bar فعندما اقوم بتصغير الشاشة لمتصفحي يتداخل الكتابات و

ويتغير ارتفاع الnavigation bar أرجو المساعدة وهذه كودي الخاص ب html & css

<!DOCTYPE html>

<title>HTML and CSS tutorial</title>

<link rel="stylesheet" href="style.css"/>
<script src="script.js"></script>

HOME MOVIES MUSIC BOOKS ABOUT ME

</h3>

    <a href="https://www.facebook.com/hozan.muhamad92" target="_blank"><img  align="left" class="fb"  src="images/fb.png" />
</a>
    <a href="https://www.linkedin.com/in/hozan-muhammed-00a051a0/" target="_blank"><img  align="left" class="ln"  src="images/ln.png" />
</a>
    <a href="index.html"><img class="mmb" align="right" src="images/mmb.jpg"> </a>

</div>

.page{margin: 0}

.nav_bar{

background-color: black; padding:10px 130px 0px 60px; border-style:ridge ; border-color: black; border-top-color: darkorange; border-bottom-color: darkorange; border-top-width:thick; height: 70px

}

body{ background-color: black; } a{ margin-right: 40px; font-weight:bold; text-decoration:none; color:white;

}

a:hover{ color:black; background-color:darkorange; padding: 15px 0px 15px 0px; border-radius: 5px;

}

.fb{ width:37px; height:41px; margin-top:-50px; margin-left:-60px ; } .ln{ width:37px; height:41px; margin-top:-50px; margin-left:-20px
}

.mmb{ width: 100px; height: 70px; margin-top:-70px; margin-right:-130px;

}