OSX Safari早期应用媒体查询15个像素

时间:2015-10-22 19:54:18

标签: css css3 safari media-queries

我有2个媒体查询尺寸 -

only screen and (min-width: 980px)and (max-width: 1499px)";

only screen and (min-width: 768px)and (max-width: 979px)";

Safari正在应用第二个媒体查询,而浏览器宽度仍在第一个范围内 - 当window.innerwidth在980 - 995之间时。

我以前从未见过这样的想法 - 任何想法?

更新 -

所以我想出了这个问题 - 新的OSX safari的媒体查询使用 document.documentElement.clientWidth 作为衡量标准 - 而所有其他浏览器(以及我编写的用于启动javascript的浏览器)同时)使用 window.innerWidth

结果是safari变得混乱,因为css加载的大小不应该是15 px -

我能找到的唯一解决办法是编写一些特定于野生动物园的js - 这不是理想的,但我能想到的唯一的东西。

1 个答案:

答案 0 :(得分:3)

window.innerWidth是视口的宽度,includes vertical scrollbars

我的猜测是媒体查询是根据视口减去滚动条的宽度触发的,这会导致18px的差异。这比我能解释得更好:

http://www.sitepoint.com/rwd-scrollbars-is-chrome-better/