이미지 Fall Of Of Div Floating되었을 때

Question

나는 내 웹 사이트의이 섹션에 많은 이미지가 있고 두 개의 열로 쌓아 올 필요가 있습니다.

나는 너비가 모두 정확하고 여백이 있으며,보기에는 정말 멋지다! 그러나 이미지에 float: left을 추가하자마자 문제가 발생했습니다.

콘텐츠의 각 섹션 하단에 테두리가 있으며, 이미지를 떠올리게 할 때 그 테두리 아래로 떨어집니다. 나는 디스플레이 모드와 몇 가지 다른 것들을 변경하려고 시도했지만 잘못된 점이 전혀 없습니다.

Here is a JSFiddle for my code.

Answer 1

당신은 이미지를 래핑 섹션에 clearfix이 필요합니다. Nicolas Gallagher의 micro clearfix을 사용해보세요.

Answer 2

이미지의 부모를 상대적으로 배치하고 오버플로 : 자동을 추가하십시오.

CSS 파일 :

.content{ 
    position:relative; 
    overflow:auto; 
} 
.data_files{ 
    float:left; 
} 

HTML : 나는 최대한 빨리 할 수있는만큼 올바른 투표 할 수 있습니다

<div class="content"> 
    <div class="data_files> 
     /*here your photos*/ 
    </div> 
</div>