質問

<div style="float:left;">
    column 1
</div>
<div style="float:left;">
    column 2
</div>
<div style="clear:both;"></div>

私は書くのに慣れています clear:both. 。しかし、Twitter Bootstrapで「ClearFix」と呼ばれるものがあると聞きました。どの要素に「ClearFix」を適用する必要がありますか?

役に立ちましたか?

解決

CSSを使用すると、After Psudeoを簡単に使用できます

.class1:after, .class2:after //append as many as you like
{
 clear:both;
 *zoom:1;
 height:0;
 visibility: hidden;
 display:block;
}

alternative(providing children are not using the position selector)
(parent-elemts){overflow:hidden;}//bit of a quick fix!

HTMLファイルから不要なマークアップを除外してください

編集:ごめんなさい!何らかの理由で、コメントボタンを追加するボタンまたはupvoteボタンは今夜私のために機能しません。

あなたの他の質問に答えるために私の答えを追加するには:

あなたが言うTwitterブートストラップは、以下に提供したCSSに似た.clearfixクラスを使用しますが、その方法を要素に追加する必要があります。この余分なコードをドキュメントに追加するには。ただし、すべてのブラウザがCSS Pseduoをサポートしているわけではありません。

他のヒント

あなたはおそらくしなければならないだけです:

<div class="container">
   <div class="row">
      <div class="span6">column 1</div>
      <div class="span6">column 2</div>
   </div>
</div>

clearfix 必要はないはずです。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top