CSS: Menu flotante (lista desordenada)

Un menu en lista desordenada (ul) en CSS.

HTML

<div class="menu">
    
        <ul id="button">
        
            <li><a href="">Inicio</a></li>
            <li><a href="">Edit</a></li>
            <li><a href="">Item</a></li>
            <li><a href="">Item</a></li>
        </ul>
        
    </div>

CSS

/* Menu */

.menu{
width:100%;
background-color: #2586d7;
position: absolute;
}


#button {  
padding: 0;  
}  


#button li {
display: inline;
}

#button li a {
font-family: Arial;
font-size:14px;
text-decoration: none;
float:left;
padding: 10px;
background-color: #000;
color: #fff;
}

#button li a:hover {
background-color: #2586d7;
margin-top:-2px;
padding-bottom:12px;
}