- ベストアンサー
ブラウザによってCSSレイアウトが崩れる
個人でサイトを運営しています。ビルダー等のソフトを使わず、ＨＴＭＬタグ打ちで作っています（独学です）。テーブルでページをレイアウトするのは好ましくないと言われているので、最近になってＣＳＳでレイアウトするようになりました。 普段ブラウザはＩＥ６を使用していて、一つ一つレイアウトを確認しながら作り上げたのです。しかし、Ｆｘを導入して確認してみると、レイアウトが無茶苦茶に崩れてしまいました。両方で崩れないように調整できたと思ったんですが、次にＩＥ７を導入して確認すると、また大きく崩れるようになってしまいました。これは単に自分のミスなのか（widthやheight、margin、paddingなどで間違いがある）、それともブラウザによって微妙なズレが生じるのは仕方のないことなのか、よくわかりません。どなたかご教授お願いします。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。私も独学で勉強している者です。 そうしたレイアウトの崩れは、exangelさんのミスという場合もあるかもしれませんが 恐らく『それぞれのブラウザ毎による、CSSの解釈の違い』という面が多いと思われます。 exangelさんが仰る「ブラウザによって微妙なズレが生じるのは仕方のないこと」に当たるかと。 私が聞いたところによると、特にIEはCSSに関して独自の解釈をする部分が多いらしいのです。 しかし他のブラウザ（Ｆｘ・opera）は、IEに比べてCSSを忠実に表現する事が多いらしいです。 なのでmonyo28さんが仰るように、Ｆｘ・opera・NNなどで確認して 崩れていなければ、exangelさんのミスは少ないという用に判断してよろしいのではないでしょうか。 とはいえブラウザのシェアという点からIEへの対応も大事かと思われますので javascriptなどでの外部CSS振り分け、CSSハック等で、IE用の対応をしていくのが良いかと思います。 （ここは私も勉強中なので、詳しくは他の回答者様等お願い致します） ちなみにIE7はCSSに関してかなり改善（？）されていると聞きます。 まだ私は使った事がないので分かりませんが… なのでIE7とIE6で見え方が違うのは当然なのかも知れませんね。。。 最後に、WindowsとMacの場合では、同じ名前のブラウザ・バージョンで あっても、見え方が違ってくることがあります。 このように全ブラウザで自分の思い通りに表示させる事は結構大変な作業になると思います。 個人サイトなのでしたら、どれだけ多くのユーザーに満足してもらうか どれだけ手間をかけてもいいか等、サイトの性質とも相談しながら お決めになってはいかがでしょうか？
その他の回答 (2)
- matchasoft
- ベストアンサー率54% (20/37)
IE6は後方互換モードと標準準拠モードの2種類あり、普通は後方互換モードになっています。 この場合、IE以外の標準に準拠したブラウザと見え方が違ってしまいます。 IEを標準準拠モードにすれば少しはマシになりますよ。 モードの切り替えはDOCTYPEで行います。
お礼
DOCTYPEは盲点でした。みなさんの意見を参考に、また頑張ってみます。ありがとうございます。
- monyo28
- ベストアンサー率9% (4/41)
Ｆｘ・operaなどの非ＩＥブラウザ向けに作り 後でＩＥで確認がいいと思います cssのみのデザインの参考にどうぞ http://css.poromeria.com/ http://www.csszengarden.com/tr/japanese/
お礼
どうやらそのようですね。サイトも参考になります。ありがとうございました。
お礼
ためになります。個人の趣味でやってるサイトなのに、神経使い過ぎてしまいます笑。かといってソフトに頼るのも何だかなあと思ってしまうんですよね。ありがとうございました。