래퍼를 사용하여 navul을 중심으로

Question

나는 < nav> <ul> < li>를 사용하여 메뉴를 만듭니다. 나는 수평으로 넣어 전체 UL의 중심을 원하지만 그것은, UL 인증이 래퍼

<div id="wrap"> 
<nav> 
<ul> 
    <li class="menuitem">Menu</li> 
    <li class="menuitem">Menu</li> 
    <li class="menuitem">Menu</li> 
    <li class="menuitem">Menu</li> 
    <li class="menuitem">Menu</li> 
</ul> 

.menuitem { 
background-color: #E3E3E3; 
float: left; 
width: 100px; 
height: 90px; 
list-style-type: none; 
text-align: center; 
color: black; 
display: inline; 
} 

#wrap { 
    margin: 0 auto; 
} 

에 마진 자동으로 중심되지 작동하지 않습니다 보인다

다음은 fiddle

Answer 1

당신이 예를 width: 200px; 그렇지 않으면 margin: auto 나던 작업을 위해, 당신의 .menu-nav 고정 폭을 제공해야합니다.

또한 .menuitem 클래스에 text-align: center; 속성이 있습니다. 이것은 텍스트를 가운데에 맞 춥니 다. 메뉴에서 텍스트를 가운데 정렬하지 않으려면 삭제하십시오.

---

는 CSS에서 고급 센터링 방법에 대한 자세한 정보를 얻으려면,이 blog post about css centering