0
これは私にとってGoogleにとっては難しい質問でしたが、私の問題を説明していない一般的な説明しか見つかりませんでした。私は箱のサイズをCSSで単純なページを持っています：width=10vw and height=10vh。css vhとvw、なぜ方向を移動するときに値が変わらないのですか？
私はjavascriptとgetComputedStyle（）を使ってボックス（div）の実際のピクセルを表示します。私の携帯電話で見ると、102x154（高さ×幅）が肖像画で54x154（高さ×幅）が横長で表示されます。
これは私にとっては不思議なことです。どうしてvwシフトしませんか？ vhとvwの両方の取引場所はありませんか？
編集：今、いくつかのコードを表示する方法I：
<style>
body{
font-size:8vw;
}
#box
{
width:15vw;
height:15vh;
background-color:silver;
}
</style>
</head>
<body>
<div id="box">Test</div>
<script>
window.onresize =resize;
resize();
function resize()
{
var el = document.getElementById("box");
var st = window.getComputedStyle(el);
el.innerText = st.height + " x " + st.width;
}
</script>
</body>
私はGoogle Chromeのデバイスエミュレータのスイッチングデバイスと向きでこれをテストしています。私は向きに応じて解像度の変更を確認しました。それでも、st.widthは決して変化しません。 st.heightは期待どおりに変化します。
私はここに明白な「落とし穴」がないことを願っています。
敬具、 ルーン
たぶん、一部のコンテンツは関係なく、あなたが設定したもの、あなたの高さを拡張していませんか？ – Justinas
モバイルで要素を検査し、緯度から緯度に変更すると、画面の解像度はA×B、B×Aですか？多分それが問題です。彼らは場所を交換する必要があります。またはボックスの内容が高さや幅を増やさないように 'max-height'と' max-width'を設定しようとします –
このペンで私のために変わりますhttps://codepen.io/adogandesign/full/ WRZmNv/ Google Chromeのデバイスエミュレータも使用しています –