Menu horizontal css

  #yo {
    list-style-type: none;
    height : 30px;
    width : 630px;
    margin : 0 auto;
    padding : 0;
    text-align center;
    border : 1px solid #f88;
    }
  #yo li {
    float: left;
    width : 150px;
    height : 30px;
    line-height : 30px;
    margin : 0 5px;
    background-color : #707070;
    }
  #yo #lig {
    margin-left : 0;
    }
  #yo #lid {
    margin-right : 0;
    }
  #yo a {
    color : #fff;
    text-decoration : none;
    }
  #yo a:hover {
    color : #0ff;
    }

  <ul id="yo">
    <li id="lig"><a href="#">wwwww</a></li>
    <li><a href="#">xxxxx</a></li>
    <li><a href="#">yyyyy</a></li>
    <li id="lid"><a href="#">zzzzz</a></li>
  </ul>

  margin : auto;

  text-align : center;

<div class="yo">
	<ul>
	<li><a href="l">w</a></li>
	<li><a href="">x</a></li>
	<li><a href="">y</a></li>
	<li><a href="">z</a></li>
	</div>