2011-08-21 2 views
1

나는 다음과 같은 코드가 있습니다내 DIV를 중심으로 점점 도움이 필요

<div id="ftr_btm"> 
     <div id="ftr_ctr"> 
      <div class="hdr_lnk"> 
       <ul> 
       <li><a>Test1</a></li> 
       <li><a>Test2</a></li> 
       <li><a>Test3</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 

다음과 같은 CSS :

#ftr_ctr {display: block; text-align: center; font-size:0.8em; position: absolute; height: 24px;margin: auto;} 
.hdr_lnk ul li { 
    display: inline; 
    float: left; 
    padding: 0; 
    position: relative; 
} 

는 내가 뭘하려고 오전 텍스트 (주소 링크)가이다 UL의 각면에 여백을 중심으로 수평으로 나타납니다. 그것은 작동하지 않는 텍스트 및 UL의 모든이와 같이 왼쪽으로 간다 :

fiddle

내가 UL의 페이지의 중앙에 표시 얻을 수있는 방법을 말해 줄 수있는 사람이 있습니까.

감사

답변

0

나는 확실히 당신이 그 코드를 가하고있는 상황의 확인, 그러나 이것은 당신이 원하는 효과를 달성해야 아니에요 :

#ftr_ctr { 
    width: 100%; 
    text-align: center; 
    font-size:0.8em; 
    position: absolute; 
    height: 24px; 
} 

.hdr_lnk ul{ 
    margin: auto; 
} 

.hdr_lnk li { 
    display: inline; 
    padding: 0; 
} 

당신이 필요한 주요 일들이 있었다를 #ftr_ctr 요소의 width: 100%; 규칙과 .hdr_lnk ul 규칙의 margin: auto; 규칙을 준수해야합니다. (폭은 100 % 일 필요는 없지만 요소를 수축 포장으로 내용을 중지하도록 설정해야합니다. margin: auto;은 내용을 수직 또는 수평으로 똑같이 가운데 맞추거나 margin: 0 auto;은 내용을 가로로 가운데에 맞 춥니 다.