異なるブラウザではテキストのサイズが異なる

Question

誰かがこの問題を以前は持っていたと確信していますが、私はそれだけでは分かりません。

私はフォームを持っています。入力の1つにJSが添付されているため、ユーザーのタイプ（キーアップ）に応じて、ページ上の他の場所のdivが入力内容と一緒に更新されます。例えば彼らは "hello"と打ち込んで、それはdivの下に現れます。

divのアップデートでは、900pxの幅よりも大きく、テキスト行が1つだけ高くなることは望ましくありません。

私はdivをオーバーフローで隠してしまい、余分なテキストが消えるだけでなく、maxlengthがinputに設定されているので、大きすぎることはできません。しかし、ブラウザによってはテキストの配置が異なっているため、ブラウザによっては（例えば）10語が許可され、他の場合は11が許可されます。

私はcssをリセットしました。これはすべてのブラウザ同じですが、テキストの間隔はそれほど影響を受けていないようです。

私の唯一の選択肢は、CSSを使用して文字間の間隔を同じ横断ブラウザに合わせようとしていますか？

誰にでも代替案を提案できますか？

EDIT

がここに私が使用しているCSSのリセットです：

html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline} 

私が使用しているフォントがあなたのCSSのリセットはかなり貧弱ですArialの32PX

Answer 1

です。ディスプレイの問題は多く修正されていますが、テキストサイジングはまったく考慮されていないため、この問題では無用です。より包括的な1つのhereを見つけることができますが、リセットページを変更すると意図しない影響が生じることがあります。いくつかの検査ツールを使ってパディングや余白があるかどうかを調べて、テキストを書き込むために使用可能なサイズを縮小するかどうかを確認し、そうでない場合は、テキストのすべての面を一貫して表示するように設定することをお勧めします。