CSS。IEの互換モードで、body要素に対して、またはbody要素にclassやidを設定してそれらを指定するセレクタを使って、widthを設定しても反映されません。常にブラウザの横幅いっぱいにbodyが表示されます(backgroundに色をつけて確認)。バグでしょうか?バグでしたらそれについて紹介しているURLを、そうでなければ解決方法に心当たりがあれば教えてください。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2006/03/01 08:43:01
  • 終了:--

回答(3件)

id:vwxyz No.1

vwxyz回答回数1ベストアンサー獲得回数02006/03/01 09:59:58

ポイント60pt

バグではないと思います。

<body>~<body>要素はブラウザのウィンドウで表示される全領域に対応します。なので最大化していればモニタ一杯まで表示されますし、小さくすれば小さくなります。これは標準準拠モード、互換モードいずれでも変わらないと思います。


URL先にあるHTMLの仕様書では「文書のbody部分には、文書内容がきます。内容の表現はブラウザによって様々です。視覚的(ビジュアル)ブラウザなら体部(body)をキャンバスに見たてることができそこに内容が表われます:テキスト・イメージ・色・グラフなど。読み取りのできるブラウザなら内容を読み上げます。」とあります。


なのでたとえば横幅500ピクセルの箱でも作りたいときは、body要素の中にdiv要素などのブロックレベル要素を挿入してそれにスタイルを別途指定すれば作れると思います。

id:renmin-plus

回答ありがとうございます。

再度試してみました。background-colorで確認した、というのにちょっと語弊がありました。bodyのbackground-colorは確かに標準モードでもブラウザいっぱいに広がりました。ちょっと質問内容を訂正します。

width指定したbodyの中に、widthをパーセンテージ指定したdiv要素を配置すると、そのdiv要素の横幅は、bodyで指定したwidthを基準にして決定される(IE6標準モード,Firefoxで確認)のに、互換モードではそうならない、です。

よろしくお願いします。

2006/03/01 13:53:44
id:Momonga No.2

Momonga回答回数20ベストアンサー獲得回数02006/03/01 12:01:39

ポイント5pt

URLはIE4当時のDHTMLのリファレンスですが、これをみるとbody要素にwidth属性を与えることは、仕様として認めていないようですね。簡単なページを作ってやってみましたが、IE6でも同様の状態であることから、仕様としてbody要素にwidth属性を与えないことは、IEとしての仕様として考えるとよいようです。body要素は、コンテンツのルート要素であるため、幅を制限する必要は無い、という考え方なのではないかと思われます。

個人的には、コンテンツ領域を制限するためには、div要素やtable要素を利用するようにしています。この方法の場合、body要素の仕様を気にすることなく制御できますので、かえって楽だと思っています。

id:renmin-plus

回答ありがとうございます。

バグであれなんであれ、旧バージョンのIEで表示がくずれるのはまずいので、回避策がbodyの下にコンテンツ領域となるdiv要素を作ること、なら、そうすることになると思います。が、とりあえず正しい仕様が気になります。。。質問にちょっと不備があって、訂正を1人目の回答者のコメント欄に記入しました。よろしくお願いします。

2006/03/01 13:56:40
id:Mars No.3

Mars回答回数203ベストアンサー獲得回数202006/03/01 15:13:09

ポイント5pt

標準モードでできて、互換モードでならないのはIE5.5までは body=html=キャンパス にしていた…というか、明確に区別されていなかったからです。

昔の動作を再現しているという意味では正しいといえるのかも。

id:renmin-plus

回答ありがとうございます。

W3Cの定める仕様に対して何が正しくて、で、古いIEがそれに準拠していないのなら、それについて言及しているURLを挙げてほしい、という質問です。

2006/03/01 15:50:56

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません