Menu Horizontal CSS y HTML

Hola, ahora aprenderemos a hacer un menu Horizontal que cubra toda la pantalla o que cubra todo nuestro navegador Horizontalmente, lo primero que haremos en nuestra hoja de estilos es lo siguiente(Si no han agregado su hoja de estilos pueden agregar las etiquetas <style></style> para poder su codigo css):

        
    //quitaremos los margenes
    *{
    margin: 0;
    
    }
    //Daremos el ancho y posicion a nuestro Menu
    .Menu{
    width:100%;
    background-color:#TuColor);
    height:65px;
    margin-top: 0px;
    z-index:999;
    position:fixed;
    }

    .MenuContent{
    width:50%;
    height:45px;
    margin-left: 20%;

















    }
    li{
    margin-top:5%;
    float:left;
    margin-left:5px;
    margin-right:5px;
    display:inline-block;
    color:#fff;
    height:55px;
    line-height: 55px;
    font-family: "Open Sans",Arial,Helvetica,sans-serif;
    font-size: 18px;
    left:15px;
    right:15px;
    padding-left:15px;
    padding-right:15px;
      }
    li:hover {
    background-color:#4A88F4;
    height:4px;
    color:#4A88F4
    }
        
    

Ahora teneniendo nuestro css agregaremos los elementos a nuestra pagina de la manera siguiente

        
<div class="Menu"><div class="MenuContent">
<nav>
<ul><li>Home</li>
<li>About</li>
<li>Hola</li>
</ul><nav></div>

Ahora nuestro Menu quedaria de la siguiente Manera