xml宣言をしたら・・・

Question

XHTML＋CSSを勉強中なのですが、下記のソースを見てください。 -----------省略-------------

-----------省略-------------

xml宣言をするまでは画面中央に表示されていたのですが、宣言の行を追加したら左側に寄ってしまいました。 CSS部分は以下のようになっています。 body { font-size: 100%; font-family: sans-serif; color: #333333; margin: 0; padding: 0; background-color: #F0F0F0; } #container { width: 800px; position: relative; margin: 0 auto; background-color: #FFFFFF; } marginの設定の仕方が悪いのかなとか考えたんですが、わかりませんでした。用はのようなことがしたいんです。どなたかご教授よろしくお願いします。

noname#20378 · Accepted Answer

しばらく解らなかったけど、CSSソース見てたら解決しました。ここでHTMLのソースを見直してみるとlink要素によるCSS指定がないのでが怪しいと判断し、このソースを調べることにしました。見ると共通するcss/all.cssとcss/top.cssとブラウザやOSごとにCSSを振り分けていることが解ります最初私はIE6専用CSSを調べに行きましたが特に怪しい部分は見つからなかったのでcss/all.cssを見始めました解決。 body { text-align:center; /*これですね*/ } IEの「過去互換モード」の別のバグを利用してます(笑) #標準準拠モードでは修正されているようです。 http://www.anslasax.net/css-make/t-a/index.html http://sourcemania.jpn.org/doc/block_center/#wrong 本来text-alignプロパティは【ブロックボックスの位置をそのままに】中のインラインテキストの位置を変えるものですが、IEは【ブロックボックスの位置ごと変更します】ということで、調べ方と共に、うまく行ってる理由、おw解りいただけましたか？

noname#20378 · Answer

#1,#2です。
余計なお節介かもしれないけど・・・言っておいたほうがいいかなと思ったので。

IEのCSS解釈にはFirefoxやOpera等他のブラウザに比べかなりのバグがあります

有名なCSS実装度チェックにAcid2というものがあります。「えむもじら」さんのところに各ブラウザでテストを受けた時の画像が載っています
http://level.s69.xrea.com/mozilla/index.cgi?id=20051030_Acid2

...というわけで、デザインで困ったことがあったり、
思ったとおりにならないときはFirefoxやOperaで確認しなおしてみるといいでしょう。

＃私は普段からFirefoxを使っています。速度や消費メモリから言ったらOperaの方が使いやすいとは思いますが。

noname#20378 · Answer

IEのバグです。

「DOCTYPEスイッチ」というものをご存知でしょうか？

娘娘飯店しるきぃうぇぶ－DOCTYPE 宣言による「解釈モード」の切り替え
http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_situation.html

で、実は
娘娘飯店しるきぃうぇぶ－ねこめしにっき2001年9月20日を見てもらうと解りますが
WinIE6 の DOCTYPE スイッチ機能不全発見 
http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/09b.html

抜粋します

【HTML ソース冒頭に XML 宣言があると、DOCTYPE スイッチせず有無いわさず Quirks 解釈（過去慣習互換≒ WinIE5.x 的解釈互換）になってしまう】

んです、IEは。

で、さらに、
文書型宣言とブラウザでの表示
http://www.mars.dti.ne.jp/~fuming/advanced/dtd.htm

>margin:autoが有効かどうか
後方互換モード:【無効】

となっています。

原因はもう解りましたね？
一般的にはXML宣言を抜く形で回避されているようです
(省略できるのはUTF-8またはUTF-16またはHTTPヘッダ等別なプロトコルで明示された場合とされているため、大抵は文書をUTF-8に変換しています)

xml宣言をしたら・・・

しばらく解らなかったけど、CSSソース見てたら解決しました。

#1,#2です。

IEのバグです。

この回答への補足

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング