`float：left;の問題

本質的に、float: left;を持つ2つのdivがあり、<br/>で区切られています。問題は、divがもう一方の隣に表示されるのではなく、一方を他方の下に表示するのではなく、間にスペースを入れて表示することです。

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

彼らはお互いの下に表示されるのをご希望の場合は、代わりにfloat:left;

を使用していない、あなたはclear:bothを使用することができますが、あなたはfloat:leftのための使用を持っていない場合は、それが簡単になりますこれを取り除く

2011-10-27 14:56:53 Curt

私が "浮動小数点：左"を使う理由は、青い枠線がテキストと "タイトフィット"するためです（空白なし）。 – Randomblue

ああ、この場合、 'clear：both'を使ってdivを強制的に下に置くことができます:) – Curt

あなたはそれらをクリアするだけです。

は clear:both;

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

2011-10-27 14:57:27

あなたが別のフロートを置くために、まず、第1フロートをクリアする必要があります。

あなたを助けることができる次の要素が動作浮かべ方法です

<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

答えて