問題タブ [viewport-units]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
2449 参照

css - 最小幅を確保しながら、VW単位で幅をサイジング

上部のサイズに vw ユニットを使用して DIV のサイズを設定するにはどうすればよいですか?

動かない...

0 投票する
1 に答える
1337 参照

css - ビューポート ユニット div 内のパーセンテージの高さは Safari では機能しません

vh ユニットを使用して、ビューポートに基づいて高さ 100% の div を作成しました。

この 100% の高さの div の中に、50% の高さの div が必要です。

Chrome では問題なく動作しますが、Safari ではあまりうまくいきません。動作するはずですが、親 div の高さに固定値を使用している場合にのみ動作します。最新のiOS 7.1ではモバイルサファリでも機能しません

デモ: http://jsfiddle.net/qQ8dm/

高さ固定で動作: http://jsfiddle.net/xbBcy/ & http://jsfiddle.net/xbBcy/1/

親 div に 50vh を使用できることはわかっていますが、vh ユニットを 1 回しか使用しない場合は、単純なパーセンテージの高さがクロス ブラウザーの互換性に適している可能性があり、フォールバックを作成しやすくなります。

0 投票する
1 に答える
10514 参照

css - Safari での CSS vw と高さ 100%

ほんの数語では説明できないため、質問の適切なタイトルを設定するのは非常に困難です。

高さ 100% の要素と固定高さvw(ビューポート幅) の親要素は、実際には Safari では高さ 100% ではありません (Mac Mavericks、Windows についてはわかりません)。0です。

私の問題を示すために、サンプル付きのペンを用意しました。Chrome を使用すると、内側の要素の高さが 100% になります。Safari (v7.0.2 (9537.74.9)) では、内部要素の高さは 0 です。

編集: iOS 7.1のiPhoneでも同じバグが発生します

0 投票する
1 に答える
1061 参照

css - vwエンティティのfont-size - 調整可能な範囲?

vwを使用して文字のサイズの範囲を調整する方法があるかどうか疑問に思い始めましたか? 次のようになるとしましょう。

デスクトップではフォントが大きくなりますが、モバイル画面では小さくなります。メディア クエリで vw を再調整する必要がある場合、vw を使用する意味は何ですか?!

例: http://css-tricks.com/examples/ViewportTypography/

0 投票する
2 に答える
25390 参照

html - Safari CSS ルール vh-units?

Safari vh ルールの修正があるかどうかは誰にもわかりませんか?

すべてのブラウザで問題なく動作していますが、Safari でのみ認識されませんか? cssでVHルールを使用できるサファリの修正はありますか?

0 投票する
8 に答える
74077 参照

css - モバイル Safari で vh(viewport unit) css を修正するには?

プロジェクトの 1 つで vh (viewport units) css を使用しましたが、モバイル サファリでは機能しません。Safari は vh をどうすればよいか分からないようですが、他のブラウザでは問題なく動作します。vh の有無にかかわらず同じ効果を出したいのですが、助けてください。ちなみに私はフェイスボックスを使っています。(高さ:50% は正常に動作しません)

html:

これは私のcssです:

0 投票する
4 に答える
22011 参照

css - vh vw の CSS フォールバックの書き方

CSS でフォ​​ールバックがどのように機能するかを説明できる人はいますか? vh と vw 用にセットアップしようとしていますが、明らかにうまくいきません...

これが私の試みた解決策ですが、うまくいきません。高さのプロパティは毎回取得されます。

CSS: