중심 AA는 고정 폭 DIV 내에서 사업부로 고정

내가 margin:0 auto; 내 HTML이 같은 구조 한으로, CSS는 다음과 같습니다중심 AA는 고정 폭 DIV 내에서 사업부로 고정

<div class="wrapper"> 
    <div class="content"> 
     <nav class="mini"> 
      <!-- nav class mini content --> 
     </nav> 
    </div> 
</div>

을, 사업부를 중심으로 문제가 있어요 안녕하세요

.wrapper { 
     width:1154px; 
     margin:0 auto; 
    } 

.content { 
    width:906px; 
    margin:0 auto; 
    text-align:center; 
} 

.mini { 
    width: 350px; 
    margin:0 auto; 
}

의 중심이 .content에 집중 될 것으로 예상되지만 잘못된 것은 아닙니다. 당신의 바이올린에

출처

2012-07-04 Udders

나에게 잘 어울립니다. http://jsfiddle.net/NEc3r/ – Samuel

@Samuel이 내 피들을 살펴보고 내 문제를 볼 것입니다. http://jsfiddle.net/pYbAP/ – Udders

나에게도 잘 어울립니다. 어쩌면 당신은 올바른 브라우저 해상도를 보지 못했을 것입니다. –

모든 div가 중앙에 배치됩니다. 유일한 문제는 당신의 리튬이 떠서 떠있는 것입니다. 그래서 귀하의 UL 센터 & 잘 보일 것입니다.

.mini ul {display:inline-block;}

바이올린 데모 : http://jsfiddle.net/surendraVsingh/pYbAP/7/

출처

2012-07-04 15:10:12 SVS

자동 여백은 효과가 없지만 그것은 부모 요소가 text-align : center를 가지고 있기 때문에 작동합니다. – Samuel

당신의 .mini 사업부가 .content 내 중심하지만 당신은 마진을 적용 할 필요가 거라고는 .mini

안에있는 내용을 중심으로하지 않은 : 거기에 UL 0 자동 CSS를 text-align : center에서 .mini를 적용하십시오.

출처

2012-07-04 15:09:01

문제는 당신이 .wrapper div에 max-width을 제공한다는 것입니다. 브라우저의 너비가 1154px보다 작 으면 .wrapper 너비가 브라우저 너비가됩니다. 브라우저 창을 충분히 작게 설정하면 .wrapper의 너비가 하위 .content 너비보다 작아집니다. 부모가 아이보다 작은 경우, margin: 0 auto, 그것은 auto이되기 때문에 할이 무엇을 할 수 없어 0

max-widthwidth로를 켜십시오, 그것은 어느 브라우저에서 당신이 그것을 원하는처럼 작동합니다 폭.

출처

2012-07-04 15:10:34 banzomaikaka

nav는 html5 요소이므로 먼저 블록으로 표시해야합니다. nav {display : block; } 사실, 기본적으로 블록으로 표시되지 않는 요소는 margin 속성을 사용하여 가운데에 맞출 수 없습니다. 대부분의 프레임 워크가 이미이 작업을 수행하지만 항상 Eric Meyer's CSS Reset에서이 CSS 재설정 코드를 사용할 수 있습니다.

출처

2012-07-04 15:26:23

중심 AA는 고정 폭 DIV 내에서 사업부로 고정

답변

관련 문제