CSS: Creating a horizontal menu/navigation bar

<div id="navbar">
    <ul>
        <li class="first"><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Projects</a></li>
        <li class="last"><a href="#">Contact</a></li>
    </ul>
</div>

#navbar {
    background-color: #d90000;
}
 
#navbar ul {
    margin: 0; 
    padding: 0;
    float: left;
}
 
#navbar ul li {
    display: inline;
    list-style-type: none;
    padding-right: 20px;
}
 
#navbar ul li a{
    float: left; 
    text-decoration: none;
    color: white;
    padding: 10.5px 11px;
}
 
#navbar ul li a:visited {
    color: white;
}
 
#navbar ul li a:hover, #navbar ul li .current{
    color: #fff;
    background-color:#bf0000;
}
 
#navbar .first  {
    /*You can put stuff here for the first item in the navbar*/
}
 
#navbar .last  {
    /*You can put stuff here for the last item in the navbar*/
}