IE6 以外では、position: fixed;がサポートされているのでどうってことはないが、IE6はposition: fixed;が使えないので、ごにょごにょしてなんとかしないといけない。
Articles tagged 'HTML'
出現条件を説明するのが難しい。IE6はfloatを指定した要素の親要素にwidth属性を指定するとfloatした要素の高さが親要素に含まれるバグがあります(詳しくはIEでfloat属性を指定した要素の親要素のborderが消えるバグを見て下さい)。このバグが発生している場合に、float属性を指定した子要素が兄要素に指定されているmargin-bottomを継承するみたい。
どうも、IEだけ異なる挙動をするので、検証してみました。vertical-align 属性のキーワード指定の初期設定が違うだけなのかと思いきや。
以前、画像置換法の問題点について書きましたが、時は過ぎ、すっかり画像置換法のお世話になっています・・ 通常と hover 時の画像を1枚にしておくとプリロードの必要がないので便利です。ですが、最近は再び、その問題点についての議論が諸処で巻き起こっているようです。
対応しなければいけない可能性がでてきたので windows 版IE5.5に関するCSSハックを調査。
しかし、floatって難儀だなあ・・・
a要素のtarget属性は使用しないことが推奨されているが、別ウィンドウの必要性が無くなった訳ではないので、Valid な新規ウィンドウの開き方を考えてみた。既出かもしれませんが。
2コラムレイアウトなどでfloatで左右に振る方法があるが、floatを指定した要素を包含する親要素のボックスは高さ0でレンダリングされてしまう。
たまたま、IE6でmarginプロパティによるセンタリングが再現できたので、原因を調査。
テンプレートをネストしてる場合の弊害ですが、いろいろ試した結果、回避方法がわかったのでメモ。
width指定した<table>内の文字列折り返しで、Safariだと指定したwidthを越えてしまう現象を発見。
CSSでコーディングしていると、<li>要素とか<td>要素に配置した画像の上下が妙にあいてたりするんだけど、これがひとつの要因ぽい。
liタグはmargin、paddingだけでは意図したスペースが指定できない場合がある。モダンブラウザではwidth、heightを指定するとイケテル。それでもIE6では2pxぐらい余分なスペースが空く。。。アンダースコア・ハックで別な値を指定しないとだめっぽい。。。
Safariで文字化けするのは<head>内で文字コードを宣言してないかららしい。
古いコンテンツを焼きなおすときは気をつけないとね。