Ich habe hier mal etwas, wie es bei google zu sehen ist, zusammen geschrieben.

Hier der css Teil:

<style>
*{
    padding:0px;
    margin:0px;
}
#wrapper{
    top:30px;
    position:absolute;
    width:980px;
    left:50%;
    margin-left:-490px;
    background:#F1F1F1;
    min-height:100%;
    height:300%;
}
#menu{
    position:absolute;
    left:0px;
    right:0px;
    top:0px;
    height:28px;
    width:100% - 36px;

    background: #2d2d2d;
    padding-top:2px;
    padding-left: 36px;
}
#menu ul li {
    list-style: none;
    color:#bbbbbb;
    font-size:10pt;
    font-family: Arial;
    line-height: 27px;
    padding: 0 8px;
    display:inline;
    font-weight:bold;
}
#menu ul li:hover{
    color:white;
}
</style>

und der html Teil:

<div id="menu">

<ul>
    <li>+Ich</li>
    <li>Suche</li>
    <li>Bilder</li>
    <li>Maps</li>
    <li>YouTube</li>
    <li>News</li>
    <li>Mail</li>
    <li>Docs</li>
    <li>Kalender</li>
    <li>Mehr</li>
</ul>

</div>

<div id="wrapper"></div>

Ich hoffe ich kann dir helfen!