<style>
#test li {
display:inline;
}
#test a {
color:#880000;
text-decoration:none;
<style>
#test li {

list-style-type: none;
list-style-position: outside;
padding: 10px;
line-height:120%;
}
#test a {
color:#880000;
text-decoration:none;
font-size: 11px;
border: 1 solid #ccc;
padding: 5px;
font-size: 20px;
}

#test a:hover {
border: 1 solid #000;
padding: 5px;
font-size: 20px;
}


</style>

<div style='border: 1 solid #ccc'>
<div style='margin-left:-30px'>
<ul id='test'>
<li><a href="#"><span>초기화면</span></a></li>
<li><a href="#"><span>회사소개</span></a></li>
<li><a href="#"><span>메뉴명이 긴 메뉴</span></a></li>
<li><a href="#"><span>짧은</span></a></li>
<li><a href="#"><span>롤오버 이미지로 지정가능</span></a></li>
<li><a href="#"><span>자동으로 길이 조정</span></a></li>
</ul>
</div>
</div>

font-size: 11px;
border: 1 solid #ccc;
padding: 5px;
}

#test a:hover {
border: 1 solid #000;
padding: 5px;
}

</style>

  <ul id='test'>
<li><a href="#"><span>초기화면</span></a></li>
<li><a href="#"><span>회사소개</span></a></li>
<li><a href="#"><span>메뉴명이 긴 메뉴</span></a></li>
<li><a href="#"><span>짧은</span></a></li>
<li><a href="#"><span>롤오버 이미지로 지정가능</span></a></li>
<li><a href="#"><span>자동으로 길이 조정</span></a></li>
</ul>