2006/03/10(金)ブラウザ互換性
主にIEの不具合ネタです。また長めです。
IEでXHTMLを標準モードで見てもらおうと思ったら、
<?xml version="1.0" encoding="UTF-8" ?>
って、書いちゃだめなんですよ!
この文を見て「何を今更」だとか「それ何のタグ?」とか思われる方は
続きを読まれる必要はございません。
IEには、イメージを回り込ませるとテキストが消える不具合と
borderが消える不具合があるよってこと。
あと、文字サイズを固定することや、レイアウトの横幅を固定することについての考え。
も、ちらっと書いちゃいました。
標準モードってのはDTD宣言で切り替わるアレのことです。
最近のブラウザでは、
"今までの正しくないブラウザ向けに書かれたHTMLを解釈するための互換モード" と
"最近の正しいブラウザ向けに書かれたHTMLを解釈する標準モード" とがあります。
HTML先頭のDTD宣言()を見て、
宣言なしや、HTML3.2、URL部分のない 4.01 Transitional は前者、
4.01 Strict や XHTML では後者ってことになります。
その二つはどう違うか。
とりあえず目に見える範囲で。
CSSの文字サイズについて予約語を使っている場合、IEではサイズが変わってしまいます。
互換モードに比べて標準モードが一回り小さいです。
標準モードの text-size:medium; は であり、
互換モードの text-size:medium; は です。
また、他ブラウザもCSSのwidthがborderを含むか含まないか、みたいなとこが変わります。
ちなみに、いい加減な指定も「好意的な解釈」か「冷たい解釈」かが変わります(笑
width:800;(単位がない!) は
互換モードでは800pxを指定したものとして解釈されますが、
標準モードではwidth指定自体がなかったことになります。
で。
問題はIE6なんですが、
より前になんかがあると強制的に互換モードになってしまいます。
「なんか」って言うのは「なんでも」です。「XML宣言でさえも」です。
正しい文書型宣言をしてるのに互換モードになってしまうとは情けない><;;
他のブラウザは標準モードなのに、IEだけ互換モードになってしまう。
widthの解釈が変わったり、文字のサイズが変わったりするわけです。
場合によっては、せっかくのデザインが崩れてしまいまうんですね。
どうしたらいいかといえば、Unicode使ってXML宣言取っ払うしかないです。
そんなこんなで、うちはXML宣言してないです。したいですが。。
# つか、XHTML1.1にVaildじゃない時点でDTD宣言もしちゃだめな気が……
あとは……
スタイルシートでイメージの回り込みを行うと
テキストが正常に描画されなくなるIEの不具合。
→ 悲しいことですが、