- ベストアンサー
IE7でのバグ、表示差異について
IE6での表示差異を調整するためスターハックを使っているのですが、IE7だけ文字のサイズ、余白の大きさにかなりずれがでてしまいました、ちなみにxml宣言をいれているため、IE6だけ後方互換モードになっています。 IE7の表示差異は何が原因なんでしょうか？他のバージョン8.0や9.0なら普通に表示されます。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
＞すいません、ここが原因の所だと思うのですがスターハックを外してもIE7だけびくともしません。 つまり、IE7で表示が崩れるのはスターハックは関係ないということですよね。 そうすると ＞IE7の表示差異は何が原因なんでしょうか？ はIE7のバグ（と言う名の仕様）が原因と考えられます。 IE7のよくあるバグがまとまった記事を見つけましたのでリンク貼っておきます。 http://coliss.com/articles/build-websites/operation/css/577.html サイト全体を見てみないことには、どこが問題かは断定できませんが、少なくともfloat:leftとposition:relativeの同時指定は問題ありですね（多分）。 http://www.htmq.com/style/float.shtml ＃IEでは変なように解釈されることがあるようです ＃それにしても複雑なスタイル指定すぎて、私にとっては脳トレ状態です（笑） ＃もっとシンプルにはできなかったのでしょうか？
その他の回答 (1)
- LOHA
- ベストアンサー率52% (203/388)
とりあえず、問題を切り分けてみるとよいかと思います。 スターハックの部分を消してもIE7でレンダリングが崩れるなら、IE7のバグの問題かもしれません。 ＃IE7ではまだCSSのバグが結構あります もしそれで直ったら、スターハックの中には、IE6,7どちらにも効くものがあるので、それを誤って使っているか、あるいはDTDか何かが原因でIE7が互換モードになっている可能性も考えられます。 スターハックが原因でないのなら、質問内容からは具体的な回答は出せませんので、補足したほうが良いかと思います。
補足
御回答ありがとうございます、補足になるかわかりませんが、以下の部分を追加させて頂きます。 div#column { line-height: 1.5; width: 500px; padding: 20px 10px 10px 10px; margin-right: 80px; margin-bottom: 30px; float: left; position: relative; left: 80px; background: url(images/backWhite.png); } * html body div#column { width: 520px; } DOCTYPE宣言は <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr"> です。 すいません、ここが原因の所だと思うのですがスターハックを外してもIE7だけびくともしません。
お礼
ありがとうございました、自分で書いといて頭が混乱してしまうようなコードになっていました。申し訳ございません、ブラウザによる表示差異を調整していたらこんなにごちゃごちゃしてしまいました。 そもそもIE6やIE7が悪いんです、これらのブラウザにあわせるためにどうしてこんなに犠牲になるものがでてきていまうのかと思ってしまいます。 もう一度教えて頂いたサイトで勉強させて頂きます。