내 탐색 모음을 가운데 맞춤 할 수 없습니다.

다음 코드는 내 탐색 막대에 사용할 수 없으므로 웹 사이트에 배치 할 수 없습니다. 내가 도대체 뭘 잘못하고있는 겁니까? float : left는 위치 지정을 위해 아무 작업도 수행하지 않습니다. 감사합니다. .내 탐색 모음을 가운데 맞춤 할 수 없습니다.

CSS

ul#list-nav { 
    list-style: none; 
    margin: 20px auto; 
    padding: 0px; 
    width: 800px; 
} 

ul#list-nav li { 
    display: inline; 
} 

ul#list-nav li a { 
    text-decoration: none; 
    padding: 5px 0; 
    width: 100px; 
    float: left; 
    background: #485e49; 
    color: #eee; 
    text-align: center; 
    border-left: 1px solid #fff; 
} 

ul#list-nav li a:hover { 
    background: #a2b3a1; 
    color: #000 
}

HTML

</head> 
<body> 
    <div id="as"> 
     <ul id="list-nav"> 
      <li><a href="#">Home</a></li> 
      <li><a href="#">About Us</a></li> 
     </ul> 
    </div> 
</body>

출처

2012-11-18 user1831677

A [바이올린] (http://jsfiddle.net)를 제공하는 것을 고려하십시오. – Sampson

그것은 이미 중앙

, 그것은 당신에 대한 명시적인 폭을 사용하는 단지이다 당신의 메뉴가 너무

Demo

CSS를 메뉴 폭 감소 고려

ul#list-nav { 
    list-style:none; 
    margin:20px auto; 
    padding:0px; 
    width:800px; 
    border: 1px solid #ff0000; 
    overflow: hidden; 
}

현재 내가이 만든 그 205px

CSS

ul#list-nav { 
    list-style:none; 
    margin:20px auto; 
    padding:0px; 
    width:205px; 
    border: 1px solid #ff0000; 
    overflow: hidden; 
}

Fixed demo 내가 트릭을 할해야 다음 믿고

출처

2012-11-18 06:40:22

감사합니다. 지금은 잘 작동합니다. – user1831677

@ user1831677 환영합니다 :) –

당신은 디스플레이를 추가해야합니다 : 블록;

출처

2012-11-18 06:34:16

은 당신과 같이 자동으로 해당 사업부의 마진을 설정 한 후 래퍼 사업부에서 탐색 모음을 감싸고해야합니다

<style> 
#wrapper { 
margin: auto; 
} 
</style> 

<div id="wrapper"> 

<!-- (your nav bar code here) --> 

</div>

출처

2012-11-18 06:36:13 scotts7777

; = " "로 정렬 = " 센터

< DIV ID는 " >

출처

2012-11-18 06:53:09 dinukadev

내 탐색 모음을 가운데 맞춤 할 수 없습니다.

답변

관련 문제