スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

IEとFirefoxでの表示の違い

ASP.NET2.0
での江戸検定サイト作成で、最後のコンテンツ作成がだいたい完了!
(サイトはコチラ

[今回追加した点]
・参考文献ページの追加
・CSSの修正(IE,FireFoxで見え方に差が無いように)


参考文献のページはまだデザインが決まっていない状態なので、今宵あたりはその辺りを煮詰めたいなぁ~って思います。


さて今回は、HP作成者にとっては悩みの種の一つである
『IE,FireFoxで表示が異なる』
という問題を対処してみました。
完璧というわけではありませんけど、だいたい似たような表示にさせることができました。
(まだ細部におかしいところがあるんだけど・・・)


IEとFirefoxでHPの画面が全然違うというのは、よくあります。
というか、WEBが本格的に始まった頃からある長い長~い問題だったりします。
まぁこういった問題については、はてなやWikiの方が詳しいので、割愛。


「デザインが違う」ということの原因で最もかかわってくる問題が
『Paddingの解釈の違い』
『Width(BOXの定義)の違い』
です。
それゆえ、上記のWIDTH指定やPadding指定をCSSなどで使用していると、必ずといっていいほどIEとFireFoxとの間で、デザインが異なってしまいます。

どう違うかというと、たとえば
------------------------------
width: 250px;
border:solid 10px #666666;
------------------------------
という指定をした場合、最終的なWidthはそれぞれ
【Firefox】270px(Borderを省いたWidth)
【IE】250px(Borderを含めたWidth)
となります。
規約にちゃんとのっとっているのはFirefoxの方らしいのです。
でも、人間が使うにあたり、最終的な幅=Widthという方が分かりやすいですよね。


とはいえ、最終的にこれだけ解釈が違ってきちゃうと・・・画面も全然違ってきてしまいます。
[Firefoxの画面]
Firefox_GAZOU


[IEの画面]
IE_GAZOU





それゆえ今回は、できるだけ
「PaddingやMarginといった幅や高さなどの値を指定する値を省略」
いたしました。

そうすることにより、IEとFirefoxでの表示の違いをかなり抑えることができます。


もしBLOGやHPなどで、同じようなIEとFirefox問題で迷っている方がおられましたら、下記のサイトを熟読されることをお勧めいたします。
かなり分かりやすく、詳細に説明が掲載されているため、かなり役に立ちましたね。

■アフィリエイトは儲からないってば■
IEとFirefoxの表示の差

■from DFJ
IEとNNのBOXの計測方法の違いについて




何はともあれ、一応は、Ver1.0における全コンテンツの作成が完了しました。
後は、全画面のデザインのチェックおよび、インターフェースの確認をして、オープンを待つばかりです。(´∀`*)





あっ!!





サイト名とバナーだっ!!!!Σ(゚Д゚;)
スポンサーサイト

Comment

コメントの投稿


管理者にだけ表示を許可する

Trackback

http://takenosuke.blog32.fc2.com/tb.php/359-35b8323c

«  | HOME |  »

プロフィール

武之介(たけのすけ)

Author:武之介(たけのすけ)
悪ノリ大好き!でも小心者ナンデス。
そんな武之介の内なる声を余すところなく書き殴ったブログ!
表の仮面(笑)でもある、「上原半兵衛道場」もヨロシク!!
メールはこちら


follow takenosukenagao at http://twitter.com


カテゴリー


最近の記事


最近のコメント


最近のトラックバック


月別アーカイブ


ブロとも申請フォーム

この人とブロともになる


ブログ内検索


RSSフィード


リンク

このブログをリンクに追加する

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。