'float : left;의 문제

this fiddle을 참조하십시오.'float : left;의 문제

본질적으로 나는 float: left; 인 두 div가 있으며 <br/>으로 구분됩니다. 문제는 div이 다른 하나의 아래에 하나씩 표시하는 대신 하나의 옆에 공백으로 표시되는 것입니다. 그들이 서로 아래에 표시하는 당신은, 당신은 clear:both을 사용할 수 있습니다 또는 float:left;

http://jsfiddle.net/XcV2v/2/

를 사용하지 않는, 소원하지만 float:left에 대한 사용이없는 경우, 다음은 간단하게 될 것입니다 경우

출처

2011-10-27 Randomblue

합니다. 당신이 그들을 아래에 하나씩 나타나게하고 싶다면 왜 당신은 그들을 부유 시켰습니까? – Jon

http://www.alistapart.com/articles/css-floats-101/ –

왜 float : left;가 필요합니까? 제대로 작동해야한다. –

clear: left이 필요하고 원하는 경우 margin-bottom:1em을 사용하여 중간에 간격을 줄 수 있습니다. http://jsfiddle.net/zn5wA/1/

float:left의 경우 <br>은 떠 다니는 요소 옆에 나타납니다.

출처

2011-10-27 14:57:12 Benjie

제거하려면

출처

2011-10-27 14:56:53 Curt

"float : left"를 사용하는 이유는 파란색 테두리가 텍스트와 "딱 맞습니다"(공백 없음) 것입니다. – Randomblue

아,이 경우에는 'clear : both'를 사용하여 div를 서로 아래에 강제로 설정할 수 있습니다. :) – Curt

지울 필요가 있습니다.

는 clear:both;

.container { 
    float: left; 
    border: solid 2px blue; 
    clear:both; 
}

예를 추가 http://jsfiddle.net/XcV2v/1/

출처

2011-10-27 14:57:27

당신은 다른 플로트를 넣어 먼저 첫 번째 플로트를 취소해야합니다.

당신을 도울 수있는 다음 요소가 작동 떴다 방법

<div id='div1' style=float:left> 
.... 
</div> 

<div style=clear:left></div> 

<div id='div2' style=float:left> 
... 
</div>

출처

2011-10-27 14:58:15

'float : left;의 문제

답변

관련 문제