3

メディア クエリを評価する際、Chrome にはスクロールバーの幅 (~17px) が含まれていないようです。

IE、Firefox、および Opera は、スクロールバーの幅をビューポートの一部としてカウントします。

たとえば、ビューポートの幅が 500px で、スクロールバーが 17px であるとします。

以下のコード:

@media (min-width: 500) {

    //code

}

500px 以上のビューポート幅でChromeで実行されます。

ただし、IE9、Firefox、Operaは、483px 以上のビューポート幅でそのコードを実行します。

私の質問:メディア クエリを実行するときに、すべてのブラウザでスクロールバーの幅をビューポートの幅に含めたり、ビューポートの幅から除外したりする方法はありますか?

4

1 に答える 1

1

IE、Firefox、および Operaは、メディア クエリにスクロールバーの幅を含めるというW3C 仕様に従いますが、Webkit ブラウザーには含まれません。

現時点では、ブラウザーに同じように処理させることはできないため、メディア クエリの幅にあまり密接に結び付けられないようにレイアウトを変更するのが最善の方法です (余分なマージンを追加します)。このようなレイアウトでは、数ピクセル早くまたは遅くトリガーしても、それほど大きな違いはありません。

于 2013-02-15T15:29:28.320 に答える