個別記事
IEの問題点
2006年06月21日
前回、XHTML1.1での記述について書き、その中でIEの問題点に触れた。
ブラウザによって見え方が違う、レイアウトが一様ではないという問題があり、その多くはIEのバグによる原因から、主にIEで発生しているということは、多くの方が指摘している。
その一つについて、「CSSによる段組(マルチカラム)レイアウト講座」に述べてあったので紹介したい(文章も一部、引用させて頂きました)。
前回書いた記述の順序・・
XHTMLで書かれる内容の最初の1行目には、XML宣言文が来なければならない。
2行目には、XHTMLを示す、DOCTYPE宣言がくる(例はXHTML1.0)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
所が、比較的新しいブラウザには「DOCTYPEスイッチ」という機能があり、DOCTYPE宣言の有無や、書き方によって表示モードを切り替える。
これは、CSSを正しく解釈できるブラウザにも、アバウトな解釈をする古いブラウザに合わせた表示をさせることができるというものである。
普通に規則にのっとり、DOCTYPE宣言した文章であれば、Standardsモードになる。つまり、仕様どおりに書かれたものをそのまま解釈する。
DOCTYPE宣言のない文書等はQuirksモードとなり、アバウトな解釈に合わせる。ただし、この場合、仕様どおりに書かれたCSSが、制作者の意図どおりに機能しない場合がある。
繰り返すが、XHTMLでは冒頭にXML宣言を記述するようになっている。しかし、WinIE6ではDOCTYPE宣言より前に何か文字列があると、Quirksモードになってしまう。これでは正しく表示されない。
特にボックスモデルでは、解釈が違うため、表示が崩れる。
この対策として、古いHTMLで記述するか、先頭にあるXML宣言を書かないということも考えられるが、それはできない。
そうなると、Quirksモードになっても表示が崩れないようなCSSを書く他ない。
ここではTipを書くつもりはないが、参考までにボックスモデルバグの対処法を同サイトから引用する。
widthを指定した要素には左右のpaddingとborderは指定しない。同様に、heightを指定した要素には上下のpaddingとborderは指定しない。
paddingまたはborderを指定した要素にはwidthやheightを指定しない。
この方法なら、StandardsモードとQuirksモードの違いによるボックスのサイズに違いは生じない。
結局、シェア9割前後(?)を占めるIEいやIEファミリーで正しく表示されれば他のブラウザがどうあれ、意に返す必要はないし、W3Cの勧告も大した問題ではないのだ。
昔、IEしか知らなかった時代、私の記述はいい加減だったから、IEにはよく馴染んだ。W3Cの勧告に近づけるようになってからも、まだネットスケープの表示がおかしいななどと、IE側から見た評価をしていた。
今は、普通のことが普通でない状況に驚いている。
ブラウザによって見え方が違う、レイアウトが一様ではないという問題があり、その多くはIEのバグによる原因から、主にIEで発生しているということは、多くの方が指摘している。
その一つについて、「CSSによる段組(マルチカラム)レイアウト講座」に述べてあったので紹介したい(文章も一部、引用させて頂きました)。
前回書いた記述の順序・・
XHTMLで書かれる内容の最初の1行目には、XML宣言文が来なければならない。
2行目には、XHTMLを示す、DOCTYPE宣言がくる(例はXHTML1.0)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
所が、比較的新しいブラウザには「DOCTYPEスイッチ」という機能があり、DOCTYPE宣言の有無や、書き方によって表示モードを切り替える。
これは、CSSを正しく解釈できるブラウザにも、アバウトな解釈をする古いブラウザに合わせた表示をさせることができるというものである。
普通に規則にのっとり、DOCTYPE宣言した文章であれば、Standardsモードになる。つまり、仕様どおりに書かれたものをそのまま解釈する。
DOCTYPE宣言のない文書等はQuirksモードとなり、アバウトな解釈に合わせる。ただし、この場合、仕様どおりに書かれたCSSが、制作者の意図どおりに機能しない場合がある。
繰り返すが、XHTMLでは冒頭にXML宣言を記述するようになっている。しかし、WinIE6ではDOCTYPE宣言より前に何か文字列があると、Quirksモードになってしまう。これでは正しく表示されない。
特にボックスモデルでは、解釈が違うため、表示が崩れる。
この対策として、古いHTMLで記述するか、先頭にあるXML宣言を書かないということも考えられるが、それはできない。
そうなると、Quirksモードになっても表示が崩れないようなCSSを書く他ない。
ここではTipを書くつもりはないが、参考までにボックスモデルバグの対処法を同サイトから引用する。
widthを指定した要素には左右のpaddingとborderは指定しない。同様に、heightを指定した要素には上下のpaddingとborderは指定しない。
paddingまたはborderを指定した要素にはwidthやheightを指定しない。
この方法なら、StandardsモードとQuirksモードの違いによるボックスのサイズに違いは生じない。
結局、シェア9割前後(?)を占めるIEいやIEファミリーで正しく表示されれば他のブラウザがどうあれ、意に返す必要はないし、W3Cの勧告も大した問題ではないのだ。
昔、IEしか知らなかった時代、私の記述はいい加減だったから、IEにはよく馴染んだ。W3Cの勧告に近づけるようになってからも、まだネットスケープの表示がおかしいななどと、IE側から見た評価をしていた。
今は、普通のことが普通でない状況に驚いている。
トラックバックURL
この記事へのトラックバックは下記のURLをコピーしてください。
この記事のトラックバックURL:
http://app.blog.livedoor.jp/ur8823/tb.cgi/50445154
この記事のトラックバックURL:
http://app.blog.livedoor.jp/ur8823/tb.cgi/50445154
この記事にコメントする