ブラウザによってCSSレイアウトが崩れる

個人でサイトを運営しています。ビルダー等のソフトを使わず、ＨＴＭＬタグ打ちで作っています（独学です）。テーブルでページをレイアウトするのは好ましくないと言われているので、最近になってＣＳＳでレイアウトするようになりました。

普段ブラウザはＩＥ６を使用していて、一つ一つレイアウトを確認しながら作り上げたのです。しかし、Ｆｘを導入して確認してみると、レイアウトが無茶苦茶に崩れてしまいました。両方で崩れないように調整できたと思ったんですが、次にＩＥ７を導入して確認すると、また大きく崩れるようになってしまいました。これは単に自分のミスなのか（widthやheight、margin、paddingなどで間違いがある）、それともブラウザによって微妙なズレが生じるのは仕方のないことなのか、よくわかりません。どなたかご教授お願いします。

No.2 ベストアンサー 回答者： reda01 回答日時： 2006/11/02 11:08

こんにちは。

私も独学で勉強している者です。
そうしたレイアウトの崩れは、exangelさんのミスという場合もあるかもしれませんが
恐らく『それぞれのブラウザ毎による、CSSの解釈の違い』という面が多いと思われます。
exangelさんが仰る「ブラウザによって微妙なズレが生じるのは仕方のないこと」に当たるかと。

私が聞いたところによると、特にIEはCSSに関して独自の解釈をする部分が多いらしいのです。
しかし他のブラウザ（Ｆｘ・opera）は、IEに比べてCSSを忠実に表現する事が多いらしいです。
なのでmonyo28さんが仰るように、Ｆｘ・opera・NNなどで確認して
崩れていなければ、exangelさんのミスは少ないという用に判断してよろしいのではないでしょうか。
とはいえブラウザのシェアという点からIEへの対応も大事かと思われますので
javascriptなどでの外部CSS振り分け、CSSハック等で、IE用の対応をしていくのが良いかと思います。
（ここは私も勉強中なので、詳しくは他の回答者様等お願い致します）

ちなみにIE7はCSSに関してかなり改善（？）されていると聞きます。
まだ私は使った事がないので分かりませんが…
なのでIE7とIE6で見え方が違うのは当然なのかも知れませんね。。。

最後に、WindowsとMacの場合では、同じ名前のブラウザ・バージョンで
あっても、見え方が違ってくることがあります。
このように全ブラウザで自分の思い通りに表示させる事は結構大変な作業になると思います。
個人サイトなのでしたら、どれだけ多くのユーザーに満足してもらうか
どれだけ手間をかけてもいいか等、サイトの性質とも相談しながら
お決めになってはいかがでしょうか？

この回答へのお礼

ためになります。個人の趣味でやってるサイトなのに、神経使い過ぎてしまいます笑。かといってソフトに頼るのも何だかなあと思ってしまうんですよね。ありがとうございました。

お礼日時：2006/11/02 22:56

No.3 回答者： matchasoft 回答日時： 2006/11/02 16:46

IE6は後方互換モードと標準準拠モードの2種類あり、普通は後方互換モードになっています。

この場合、IE以外の標準に準拠したブラウザと見え方が違ってしまいます。
IEを標準準拠モードにすれば少しはマシになりますよ。
モードの切り替えはDOCTYPEで行います。

参考URL：http://ameblo.jp/matchasoft/entry-10018174908.html

この回答へのお礼

DOCTYPEは盲点でした。みなさんの意見を参考に、また頑張ってみます。ありがとうございます。

お礼日時：2006/11/02 22:57

No.1 回答者： monyo28 回答日時： 2006/11/02 04:26

Ｆｘ・operaなどの非ＩＥブラウザ向けに作り

後でＩＥで確認がいいと思います

cssのみのデザインの参考にどうぞ
http://css.poromeria.com/
http://www.csszengarden.com/tr/japanese/

この回答へのお礼

どうやらそのようですね。サイトも参考になります。ありがとうございました。

お礼日時：2006/11/02 22:37