Q&A
「IEは捨てる」という選択肢を。
Javaアプリケーションから取得したテキストファイルの内容をHTMLで表示する、というプログラムなのですが、IE11とChromeで表示が異なってしまい困っています。（Chromeの表示が正です。）
HTML
1<html><head> 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 3 <meta http-equiv="content-style-type" content="text/css"> 4 <meta http-equiv="content-script-type" content="text/javascript"> 5 <meta http-equiv="content-language" content="ja"> 6 <meta http-equiv="Pragma" content="no-cache"> 7 <meta http-equiv="Cache-Control" content="no-cache"> 8 <meta http-equiv="Expires" content="0"> 9</head> 10 11<body onhelp="return false;"> 12<div id="mytext"><pre> xxxx-xxxxxx-xxxxx 13 xx-xx-xx xx･xx ああ999 QQQ9-99* 14 ああああ ああああ9999 ｱｱｱｱｱｱQQ 999-1 15 16 9あ 17 ああああ 000000 ああ 18 ああああああ 999999 あああ 000000 19 あああ 000000 20 あああ 000000 21 あああ 000000 22 あああ 000000 23</pre></div> 24 25 26<script id="jwd_siteplus_common" src="http://cdn.jword.jp.estart.jp/pub/siteplus/_js/siteplus_common.js?rnd=4314375" charset="UTF-8"></script></body></html>
このファイルをhtmlとして保存して、実際に両ブラウザで見ていただけるとわかりやすいと思います。IE11だと妙にガタついてしまっており、見づらくなってしまっています。
・なぜこのようになってしまうのか？
・Chromeと同等の表示をする方法はないか？
ご回答宜しくお願い致します。
IEの使用は絶対条件なんですよね…。
捨てられるものなら全力で投げ捨てたいところなんですがｗ
まぁ特に指定してなければブラウザのデフォルトに依存するのはどんなプロパティでも同じなので、そこは「明示する」しかないかなと。
「妙にガタついてしまっており」という状況が何を指すのか分かりません。
画像を提示してください。
特にフォントが指定されていないようなので、あなたの環境でどのように表示されているかは私には分かりません。
>m.ts10806さん
そうですよね。ありがとうございます。
解決策が見つかったのでクローズとさせていただきますね。
回答2件
0
なぜこのようになってしまうのか？
フォントもレンダリングエンジンも別物だしデフォルトのスタイルも異なるので、違って当然です。
Chromeと同等の表示をする方法はないか？
完全に同じにすることはできないので、できるだけ差異を少なくするということでしょうね。
そのためにできることは
- リセットCSSでレイアウトの初期状態をできるだけ同じにする
- CSSでレイアウトを作り込む
- 可能ならフォントを同じものにする
くらいでしょうか。
テキストのレイアウトも<pre>で整形しようとなどせずにCSSを駆使するべきですね。
投稿2021/06/18 10:42
総合スコア8402
レイアウトがファイルによって全く異なる為、作りこみは厳しいです。
リセットCSSやフォントについては、一度試してみようかと思います。ありがとうございます。
reset.cssの他に、クロスブラウザでなるべくデフォルト状態を均等に保つNormalize.cssというものもありますので、こちらもぜひ検討してみてください^^
https://necolas.github.io/normalize.css/
>runnynoseさん
ありがとうございます。一通り試してみたものの、結局どれも解決には至りませんでしたが、解決策は見つかったのでクローズとさせていただきます。
0
自己解決
htmlの文字コードがutf-8、読み込むテキストファイルの文字コードがShift_JISだったのですが、読み込み時の文字コードにShift_JISを明示的に指定、及びhtmlの文字コードをShift_JISにして統一することでレイアウト崩れが起きなくなりました。皆様ありがとうございました。
投稿2021/06/21 01:23
総合スコア29
あなたの回答
tips
プレビュー
