postcss-media-minmax
postcss-media-minmax copied to clipboard
postcss
Change integer pixels by .02px rather than 1px
According to the Bootstrap developers, using .02px rather than .01px should be sufficient to work around the Safari rounding bug.
Fixes #19.
I don’t have a Mac myself, but twbs/bootstrap#25177 has been tested extensively in Safari, having been part of Bootstrap for the last three years.
I’m not sure how to interpret “1px will have bugs?”, but if the question is whether this solves a real problem with the existing 1px offset, the answer is yes. On high-DPI screens or at non-default zoom levels, Firefox and Chrome do in practice evaluate media queries at fractional px sizes, so that it’s possible for neither @media (width <= 599px) nor @media (width >= 600px) to match. I have observed this. See also
https://stackoverflow.com/questions/51566916/why-does-bootstrap-use-a-0-02px-difference-between-screen-size-thresholds-in-its https://github.com/w3c/csswg-drafts/pull/1083 https://bugzilla.mozilla.org/show_bug.cgi?id=1120090 https://bugs.chromium.org/p/chromium/issues/detail?id=689096
I'm sorry to reply to you so late. I ran git rebase origin/master on this branch to make sure there are no extra messages on the commit.
I think the change to 0.02 is better, it fixes some browser bugs that I was able to reproduce in Chrome 103 on my MacBook Pro.
I'll need to do some further research on the JS logic changes, and may be able to merge them after some tweaking.
Thanks. It looks like you rewrote all the Git history to change your email address—FYI in the future, better practice for that is to add a mailmap.
I removed the empty commit left on this PR by your rebase.