DIV中menu的作法

HTML:

<div id="menu">
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>
</div>
<div id="wrapper">


CSS:

#menu {
position: relative;
height:1.7em;
line-height:1.7em;
width:450px;
padding: 0 0 0 20px;
margin: -30px 0 0 0;
z-index:2;
}

#menu ul {
margin:0;
padding:0;
}

#menu li {
float:left;
margin:0;
padding:0;
list-style-type:none;
border-right:0px solid;
white-space:nowrap;
}

#menu li a {
display:block;
padding:0 5px;
text-transform: uppercase;
font-size:12px;
letter-spacing:1px;
color: #000;
}

#menu li a:hover {
text-decoration: underline;
}

效果就跟我的博客的顶部菜单一样.