CSSハックの中でも最も有名で最も使われているのが clearfix だろう。 CSSハック嫌いの僕でも clearfix の有用性だけは認めざるを得ない。 それでもCSSハックは使いたくないのでできるだけ簡潔な表現にした。 ネタ元はこちら：A new micro clearfix hack – Nicolas Gallagher IE6/7どころかIE8もサポートしない最強の clearfix である。 IE9 と Chrome, Firefox, Safari, Opera の最新版で動作することを確認済み。 .clearfix::after { content: ""; display: table; clear: both; } ネタ元の以下の clearfix はIE6+をサポートするので困ったらコッチを使うと良い。 /** * A new micro clearfix hack
現在この中でclearfixでよく使用されているプロパティは display:inline-block; height:1%(min-height:1%) zoom:1; でも良く考えたら、全て微妙です。 zoom:1はIEの独自仕様ですし、heightを使用する場合は、IE6,7に対応させるために2つのプロパティが必要です。 display:inline-blockもボックスの要素を変形させることになります。 hasLayoutのスイッチを見た時に、一番理に適ったプロパティはwidthかなと思いました。 子要素を囲む要素として、divやulなどデフォルトCSSがdisplay:blockのプロパティのものが多く、display:blockのプロパティの場合、width:100%で問題ないと思ったからです。 現在のブラウザ状況に適したclearfix 上記を踏まえ見直したclearfixが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く