スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

IE6でフロート落ちが発生する。

IE6で以下のようなレイアウトを設定すると、フロート落ちが発生する。
IE6以外では問題なし。

原因は、IE6のwidthの解釈。
本来ならば、widthは、borderを含まないようになっているが、IE6では、
borderを含んでしまう。

そのため、設定によっては、フロート落ちが発生してしまう。
(以下参照)

+?????????????????????+
|+?????????++????????+|
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||    A        ||      B      ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
||             ||             ||
|+?????????++????????+|
+?????????????????????+

上記のようにBoxを指定し、AにフロートとPadding-rightを設定し、
Bにフロートを設定すると、フロート落ちが発生する。

これを回避するためには、以下のようにする。
(1):Aのwidthをpadding-rightを含んだ値で設定する。
(2):Bのwidthを設定する。(これを忘れるとフロート落ちの原因になる。)


スポンサーサイト

コメントの投稿

非公開コメント

プロフィール

e.swan

Author:e.swan
FC2ブログへようこそ!

最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。