2010-08-11 6 views
-1

image of css layout that i wantCSS를 두 개의 열 레이아웃 문제

인공 고관절 내가 두 개의 열 함께, 가지, 내가 도스을 가진 문제를 겪고 달성 할 레이아웃하지만 두 번째보다 첫 번째 이상이며, 흰색 내부를 받고 div.

그래서 ..

div1 : div1하지만
div3 및 div4도 자동 높이 div가있는 흰색 BG와 동일, 회색 BG에서 : 그냥 자동 높이와 블랙 BG
DIV2와 사업부입니다 일부 div 4는 div 3보다 길거나 다른 방법으로 사용할 수 있습니다. 따라서 div1과 div2는 늘려야합니다.
div5-8은 이미지입니다.

나는 div의 위치를 ​​얻을 수 있지만 흰 div (div 3 왼쪽 떠있을 때)에 머물지 않을 것이다 그들은 div 3가 흰색과 검은 색 div의 위에 있었고 if 나는 그것이이 div1보다 2

뻗어 이상 또는 나는 또한 흰색 사업부 내에서 그들 모두를 얻을 수 있도록하지만, 왼쪽 div4 부동하지 않고 도움이 = 내가 아는/

어떤 위치 문제가 나던있는 ,하지만 몇 가지 조합을 시도하고 그들이 일을 못해,이 시점에서 나는 어떤 상대적인 위치 또는 아무것도 사용하지 않습니다.

도움을 받으실 수 있습니다.

답변

0

div3 및 div4는 float 에드 ...

div5해야 - div8 ... clear:both; 그것의 JIST입니다

<style> 
     div       { overflow:hidden; } 
     div.3, div.4     { float:left; } 
     div.5, div.6, div.7, div.8 { clear:both; } 

    </style> 
    <div class="1"> 
     <div class="2"> 
     <div class="3"></div> 
     <div class="4"></div> 
     <div class="5"></div> 
     <div class="6"></div> 
     <div class="7"></div> 
     <div class="8"></div> 
     </div> 
    </div> 

, 당신은 나머지를 입력해야합니다

+0

감사합니다. 오버플로 : 숨김, 일어났습니다!, 무슨 일을하는지 확실하지 않지만 조사가 잘못되었습니다. 다시 한 번 감사드립니다! – Gmo

+0

예기치 않은 오버플로는 지정하지 않으면 펑키합니다. 나는 보통 그것을 숨겨 지도록 설정했다. 드물게 콘테이너의 바깥 쪽에서 볼 수있는 무언가가 필요합니다 ... – xandercoded

1

960 Grid System로 이동하십시오. 960 프레임 워크를 사용하면 위의 모형을 몇 분 안에 완성 할 수 있습니다.