중첩 된 div 내에서 float div divstring

Question

MasterParent div 내에 두 개의 div 열 (ColumnA 및 ColumnB)이 있습니다. 이 두 열은 float : left를 사용하고 있습니다. OK 문제 없습니다. 공장.

이제 ColumnB 내에서 3 개의 개별 열 (Column1,2,3)이 필요합니다.

플로트 column1,2,3가 모두 왼쪽이되도록 함께 버트업을합니다. 그러나 새로운 행을 시작하고 이전 열의 플로트를 지우려면 MasterParent까지 지워지고 그 아래의 다음 줄이 지워집니다. ColumnA의 하단의 수평 위치.

MasterPArent div까지만이 아니라 ColumnB를 통해서만 정리할 수 있습니까?

Answer 1

아무 것도 지울 수없고 overflow: hidden을 MasterParent div에 추가 할 수 없습니다. 이 jsFiddle을 확인하십시오.

.Container 
{ 
    overflow: hidden; 
} 
.Col1 
{ 
    float: left; 
    width: 50%; 
} 
.Col2 
{ 
    float: left; 
    width: 50%; 
} 
.Col2a 
{ 
    float: left; 
    width: 33%; 
} 
.Col2b 
{ 
    float: left; 
    width: 33%; 
} 
.Col2c 
{ 
    float: left; 
    width: 33%; 
} 

<div class="Container"> 
    <div class="Col1"> 
     <p>Column 1</p> 
    </div> 
    <div class="Col2"> 
     <p>Column 2</p> 
     <div class="Col2a">2a</div> 
     <div class="Col2b">2b</div> 
     <div class="Col2c">2c</div> 
    </div> 
</div>