私のデモビデオをご覧ください。https://youtu.be/8BQ_UgMGK2Eレムの高さは、クローム・デバイス・エミュレーション（およびモバイルデバイス）にスケーリングされたのはなぜ
私はremは、コンポーネントのための偉大であることを確信している、とemサブコンポーネントについては、私のように私のheight:5remはroot以外のものに対応していますfont-size:16px
なぜ私はdevic E /モバイルエミュレーションはremは16pxにで一貫している必要がありますように関係なく、画面上にあるどのように多くのピクセル、ルートフォントサイズを拡大縮小すると思われる
window.devicePixelRatioに一貫性があると言います2私は上記のコメントで述べたように、あなたはあなたの文書のhead要素へviewport meta tagを追加することによってこの問題を解決することができます。例えば
：
<meta name="viewport" content="width=device-width, initial-scale=1">
そうすることで、これはあなたがブラウザのビューポートの幅とスケーリングを制御することができます。このタグのcontentの値がwidth=device-widthである場合、画面の幅はデバイスに依存しないピクセルと一致し、すべての異なるデバイスが拡大縮小され、一貫して動作するようになります。
具体的な情報については、私が答えたa related questionです。答えはmax-widthとmax-device-widthの違いについてより詳細に説明します。
有用なリンクhttps://css-tricks.com/probably-use-initial-scale1/ – neaumusic
答えは、ジョシュクロージャーで述べたように追加することです
<meta name="viewport" content="width=device-width, initial-scale=1">
index.html<head>セクション
あなたのビューポートのメタタグはどのように見えますか？ –
これは正常です、ちょうどメタキャラクタutf8 – neaumusic
いいえ。[viewport]（https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag）メタタグが指定されていないようです... 'を追加してみてください。 –