CSSハック 一覧（ボックス表示）

使う機会は滅多に無いんだけど、知識として知ってないと困ったりしたので、取りあえず現在主流だろうブラウザのハックを自分のまとめ用に。 実際の状況を確認出来るように、デモページもご用意しました。 必要あるか分かりませんがダウンロードも出来るようにしときました。 拡張子がshtmlとかなってるので、htmlにして下さい。 ハックのデモページ デモページのファイル一式ダウンロード(zip:14kb) ...

通常、floatさせている画像やボックスなどがある場合何らかの形でclearするか、その親要素にfloatを指定しないと、親要素からはみ出してしまいます。 コレはCSS2.0の仕様なんで正しい表示なんですが、どうしても親要素にfloatなどが使えず、やむなくclear:bothをbrなりdivにクラス指定して解決してたりって事があったかと思います。 IEの場合はwidth、もしくはheightを指...

beta2くらいから出てたIE7用のハックですが、正式版でも修正が入っていなかったようです。 あまり頼りたくはありませんが、IE7のバグはこれからどんどん出てきそうなんで覚えておいた方が良さそうですね。 *:first-child+html...

IEが子セレクタに対応していないというのを利用したテクニックです。 一番最初に覚えるべきハックとも言えるほど、便利なハック。 やり方 div#g_navi ul { margin-left:-5px; width:600px; } /*IE以外に...*/ div#g_navi > ul { margin-left:0; } ↑こんな感じで、IE用の値を書いた後に、IE以外用の値を子セ...

CSS覚え始めの頃、多様していたハックがアンダースコアハックです。 アンダースコアハックとは、Win版IEのみ適用させたい時に使います。 コレは、IEのバグを利用したテクニックで、プロパティの前に特殊記号などが記述されていた場合でも読み飛ばして通常と同じように解釈してくれます。 記述方法はいたって簡単。 プロパティの前に　_　を置くだけ。 使いどころとしてはかなり多様で、IEだけ表示がおかしい時に...

よく使うハックをメモしようと思ったのですが、MacIE5用のハック以外あまり使う機会がないですね。 現在でも、未対応で作成しているサイトも見かけますが、 完全に対応しなくていいよ。と早く世間的に言われるようになって欲しいものです。 /*--------------------MacIE5*/ /*\*//*/ @import url(mac_ie5.css); /**/ 別名で、バックスラッシュハ...