2013-02-20 3 views
0

나는 원하는대로 최대 폭을 적용한 2 개의 div가 있습니다. 하나는 900px의 최대 폭을 가지지 만 다른 820px는 윈도우 크기가 작아지면 축소됩니다. 최대 너비의 가운데 div

<div id="componentWrapper"> 
    <div class="thumbContainer"></div> 
</div> 

#componentWrapper{ 
    position:absolute; 
    height:190px; 
    width:100%; 
    max-width:500px; 
    top:50%; 
    background:red; 
    margin-top:-85px; 
} 

#componentWrapper .thumbContainer{ 
    top:0px; 
    left:0px; 
    height:180px; 
    max-width:420px; 
    margin-left:40px; 
    margin-right:40px; 
    background:green; 
    overflow:hidden; 
} 

http://jsfiddle.net/DzgQ3/1/

나는 순수 CSS 가능하다면 지금이 내 창을 중심하려합니다. 윈도우가 바깥 쪽 요소의 현재 너비보다 작아 지더라도 중앙에 있어야합니다.

+0

나를 위해 설명해 주거나 뭔가 빠져있는 것처럼 작동하는 것 같습니다. – byronyasgur

+0

FF로 보입니다. –

답변

1

여백 : 자동; 대개 그런 것들을 위해 일합니다.

+0

레이아웃이 작동하지만 내 질문은 창 내부의 div를 가운데에 배치하는 방법이었습니다. 여백을 두는 것은 창 크기가 바깥 쪽 div보다 크면 창 크기가 바깥 쪽 div 원래 크기보다 작아지면 여백을 더 이상 가운데로 만들지 않습니다. – Toniq

+0

나는 당신이 지금 시도하고있는 것을 보았다고 생각합니다. 나는 위치를 사용할 때 방법이 있다고 생각하지 않습니다 : 절대적입니다. 이것이 필요한가요? #componentWrapper { float : top; 여백 : 자동; 신장 : 190px; 너비 : 100 %; 최대 너비 : 500px; 배경 : 빨간색; margin-top : 30 %; } –