Запросы мультимедиа и ширина полосы прокрутки

Я работаю над макетом, который нуждается в точной обработке запросов мультимедиа. Одна из моих проблем - это кроссбраузер ширина полосы прокрутки, поскольку он отличается от браузеров, и большинство (все из них?) Включают его в ширину окна.

Как мы видим в этих двух примерах, медиа-запросы не действуют при одном и том же размере окна с вертикальной полосой прокрутки и без нее:

В первом примере вы можете увидеть изменение цвета фона точно в ширину окна 800/700/600px.
Во вторых примерах с полосой прокрутки цвета меняются:

  • Chrome и firefox: 779/679/579px
  • IE: 783/783/583px

Это имеет значение до 21px.

Есть ли работа, игнорируя полосу прокрутки в запросах медиа и фокусируясь на самой доступной ширине.
Если вы не справляетесь с этой проблемой, вы фиксируете максимальную ширину для scollbar и включаете ее в медиа-запросы?

- ОБНОВЛЕНИЕ -

Я ищу лучшие практики/решения с CSS, поскольку я хотел бы избежать JS для этого проекта.

Ответы