my_menu_creation_1.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MY MENUBAR</title>
</head>


<style>
    .container {
        background-image: url(https://cdn.pixabay.com/photo/2016/10/20/18/35/sunrise-1756274_1280.jpg);
        border: 2px solid black;
        border-radius: 30px;
    }

    .container ul {
        overflow: auto;
    }

    .container ul li {
        float: right;
        padding: 20px 30px;

    }

    .container a {
        color: white;
        text-decoration: none;
        font-family: 'Times New Roman', Times, serif;
        padding: 3px 3px;
    }
    
/*&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& container 2 css    $$$$$$$$$$$$$$$$$$$$$$$$$$$ */

.container2 {
        margin: 550px 0px;
        background-color: rgb(255, 192, 203);
        border: 2px solid black;
        border-radius: 30px;
    }

    .container2 ul {
        overflow: auto;
    }

    .container2 ul li {
        float: right;
        padding: 20px 30px;

    }

    a {
        color: black;
        text-decoration: none;
        font-family: 'Times New Roman', Times, serif;
        padding: 3px 3px;
    }


</style>


<body>
    <header>
        <nav class="container">
            <ul>
                <li><a href="#">HOME</a></li>
                <li><a href="#">SERVICES</a></li>
                <li><a href="#">POLICY</a></li>
                <li><a href="#">CONTACT</a></li>
                <li><a href="#">DOCUMENTS</a></li>
                <li><a href="#">EDIT</a></li>
                <li><a href="#">WITHDRAW</a></li>
                <li><a href="#">OPEN</a></li>
            </ul>
        </nav>
        
        <nav class="container2">
            <ul>
                <li><a href="#">HOME</a></li>
                <li><a href="#">SERVICES</a></li>
                <li><a href="#">POLICY</a></li>
                <li><a href="#">CONTACT</a></li>
                <li><a href="#">DOCUMENTS</a></li>
                <li><a href="#">EDIT</a></li>
                <li><a href="#">WITHDRAW</a></li>
                <li><a href="#">OPEN</a></li>
            </ul>
        </nav>
    </header>


</body>

</html>