2016-09-24 8 views
1

주위를 둘러 보았고 고정 된 내비게이션 막대를 수평으로 중앙에 배치하는 방법을 찾을 수 없습니다.고정 된 탐색 막대를 가로로 가운데 맞추는 방법은 무엇입니까?

당신은 내가 어떻게하는지 설명하고 이유를 설명해 줄 수 있습니다.

감사합니다.

#nav { 
 
    list-style: none; 
 
    position: fixed; 
 
    margin-top: -10px; 
 
    width: 100%; 
 
    font-family: Product Sans; 
 
    font-size: 0; 
 
} 
 
#nav li { 
 
    width: 200px; 
 
    height: 50px; 
 
    display: inline-block; 
 
    text-align: center; 
 
    padding-top: 5px; 
 
    background-color: white; 
 
    font-size: 30px; 
 
}
<ul id="nav"> 
 
    <li>stack</li> 
 
    <li>over</li> 
 
    <li>flow</li> 
 
</ul>
당신은 UL

내부의 리튬 항목을 정렬 중앙에있는

답변

1

그래서 CSS는

<style> 

#nav{ 
    list-style: none; 
    position: fixed; 
    margin-top: -10px; 
    width: 100%; 
    font-family: Product Sans; 
    font-size: 0; 
    text-align:center; 
    padding-left:0px; 
} 
#nav li{ 
    width: 200px; 
    height: 50px; 
    display: inline-block; 
    text-align: center; 
    padding-top: 5px; 
    background-color: white; 
    font-size: 30px; 
} 


</style> 

하고 변경없이 HTML을 유지합니다

0

를 추가하면됩니다.에서 #nav까지 :

<style> 
#nav{ 
    list-style: none; 
    position: fixed; 
    margin-top: -10px; 
    width: 100%; 
    font-family: Product Sans; 
    font-size: 0; 
    text-align: center; /* <--- */ 
} 
</style>