floatを解除する手法のclearfix と 次世代のレイアウトの話
floatを解除する手法のclearfix と 次世代のレイアウトの話 2013-06-20 / 2013-06-30 2011年にclearfixについて記事を書きましたが、Micro clearfixなどの新しい手法も出てきました。 記事を書いてから2年が経ち、色々思うところも出てきたので、改めてclearfixについて書きます。 floatを解除するには CSSでレイアウトの構築を行う際に、よくfloatプロパティが用いられます。 しかしfloatを使用すると、「親の背景が表示されない」「下の段のレイアウトが崩れる」などのトラブルが起こりやすくなります。 floatプロパティの特性 親の背景が表示されない理由は、floatプロパティを指定しているボックスが浮動化し、通常のボックスのフローから外されることが原因です。 通常フローから外されたボックスは、親のボックスの高さを認識できなくな
はねつき IE６で勝手にコンテンツ内容が複製されるバグ
よく、バグが多いバグが多いと嘆かれ続ける、業界ナンバーワンシェアの我らがふぁっきんIE様。 で、今日もまた恒例のバグに直面したわけです。それがタイトルにあるとおり、コンテンツ内容が複製されるバグというやつ。どうにか無事解決も出来たので、今回もメモがてらに書いてみます。内容は長くなるので以下に。 コンテンツ内容が複製される、別の言い方をすると、最後の内容物のゴーストが作成されるとでも言うのでしょうか。もしくは分身とか残像とかそんな感じ。 言葉だけだとわかり辛いので、画像を用意してみました。 Opera9で見た場合 IE6で見た場合 こんな感じでIEの方では最後の内容物の文字が複製されて下にはみ出してます。ちなみに、これが文字じゃなくて背景画像だった場合、背景画像が複製されることもあるそうで。 でサンプルソースはこんな感じ。 <body> <div id="container"> <di
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
