macとwindowsのレイアウト崩れについて

Question

macで作成したwebサイトをwindowsでも確認したところ、レイアウトが一部崩れている部分がありました。

本来なら写真の下に文字を配置されるはずが、写真と文字が重なってしまう表示になってしまうのですが、この場合どのような方法をとれば良いのでしょうか？

テキストのサイズが変わって大きく崩れたというような感じでもないようです。

急ぎで回答をいただきたいです。
どうぞ宜しくお願いいたします。

ORUKA1951 · Accepted Answer

まず、ブラウザが標準モードで起動しているか確認すること。

　IEは互換モードと言って、過去の間違った解釈を基に作成されたページを表示するための互換モードを持っています。標準モードだと他のブラウザと同じ解釈をするはずです。
　詳しくは
DOCTYPEスイッチ - Google 検索( https://www.google.co.jp/search?q=DOCTYPE%E3%82% … )
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
ないし
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
　お勧めはもちろんstrictです。『HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』1999年のHTML4.01の勧告以来言われ続けてきたことですから。いずれHTML5の時代にはtransitinalなものは一切なくなりますから。

　ついでHTMLの文法チェック
　⇒Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html )
　スタイルシートは
　⇒W3C CSS 検証サービス( http://jigsaw.w3.org/css-validator/#validate_by_ … )

　大抵は、ここまでで解決すると思います。

　なお、ウィンドウサイズは640px以上あれば閲覧できるようリキッドデザインで作成しましょう。昨今のようにスマホから超幅広のディスプレイがある時代必須ですね。
div.article{width:90%;min-width:640px;max-width:1000px;margin:0 auto;}

kiyomac#1 · Answer

テキストサイズは『pt　ポイント』で決めて居ませんか？
テキストサイズを『px　ピクセル』に変更すれば殆ど問題は無いはずです。

Macの解像度は72dpi、PCは96dpi
（Macの12ポイントはPCでは16ポイントに成ります）

尚：検証にはＩＥは使わず、表示確認のみが宜し。
＊ＩＥは『HTML5規格』に非対応です。
おまけ
Macでの画面カンマ数値を『2.0』にすると『色再現』が良い様です。

nanden1548 · Answer

HTMLのバージョンは？・・・
ご使用のブラウザは？・・・
ソースを見てみないとよくわかりませんが、safariとＩＥのブラウザの違いによるものでは？・・・
webkitなどを、ＣＳＳに適用されていますか？・・・

macとwindowsのレイアウト崩れについて

まず、ブラウザが標準モードで起動しているか確認すること。

テキストサイズは『pt ポイント』で決めて居ませんか？

HTMLのバージョンは？・・・

このQ&Aを見た人はこんなQ&Aも見ています

関連するカテゴリからQ&Aを探す

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

テキストサイズは『pt　ポイント』で決めて居ませんか？