2

こんにちはみんな（もちろん女の子も）

Webkit とメディア クエリに大きな問題があります。基本的に、それらは必要な後に約 15 ～ 30 ピクセルしか開始していません。

Javascript を有効にしてページを読み込むと、コンソールから正しいデバイス幅を確認できます。これは、スローした拡張機能の配列に対応しています。

JavaScriptを無効にすると同じ結果が得られるため、明らかに、JavaScriptやプラグインが問題を投げ出しているわけではありません。

開発ツールでは、インスペクタ タブを見ることができます。関連するメディア クエリは、想定されるまで開始されず、開始された解像度がメディア クエリ自体と一致しないことがわかります。

私は今、他の提案を思いつくことができないので、これについて何か助けていただければ幸いです。

私を助けるのに役立つ情報があれば、私に知らせてください（非開示のため、提供できるスクリーンショットに制限があります）。

前もって感謝します & ここで願っています :-) ジョン

4

3 に答える 3

2

Twitter で質問を共有した後、修正されたこのリンクが送信されました

http://mattstow.com/your-media-queries-are-wrong-fix-them-with-viewport-genie-and-mqg​​enie.html

基本的に、メディアクエリを適用するときにWebkitはスクロールバーを考慮に入れておらず、メディアクエリがオフになっている正しいスペースを（私にとっては）説明すると言っています。Googleで検索しても情報が見つからなかったので、他の人がこの回答を役に立つと思うことを願っています. 明らかに、検索を絞り込むことができるようになったので、おそらくそこで答えを見つけることができるでしょう.

于 2013-08-14T12:44:37.697 に答える
1

ブラウザの幅とビューポートの幅の違いを確認してください。モバイル、タブレットなどで設計したいのは後者です。

于 2013-08-14T12:24:08.413 に答える
1

スクロールバーが原因です.jsから計算された幅とメディアクエリで定義した幅は、スクロールバーが原因で同じではありません(一部のブラウザーでは同じですが、すべてではないと思います)。

js とメディア クエリが同じになるように、幅を同期する必要があります。メディア クエリの幅を使用する場合は、CSS でその変更を確認するための要素が必要になる可能性があります。js幅を使いたい場合は、ボディにクラスを簡単に追加して、そのクラスでメディアクエリをターゲットにすることができます. 他の同期方法もあると思います。

于 2013-08-14T12:28:19.767 に答える