Fractional part is not generated when using `<` or `>` with `px` values

[simevidas]

I'm testing this plugin on Codepen. (Click on the icon in the top right corner of the CSS panel, and then click "View compiled CSS.")

Source:

@media (40em <= width < 60em) {}
@media (400px <= width < 600px) {}

Generated:

@media (min-width: 40em) and (max-width: 59.999em) {}
@media (min-width: 400px) and (max-width: 599px) {}

Could you explain why the plugin generates 599px instead of 599.999px, like with the em value? This is needed because without it, values between 599px and 600px aren't included in the media query, but they should be according to width < 600px.

[Semigradsky]

@simevidas see https://github.com/postcss/postcss-media-minmax/pull/14

[andersk]

To work around that Safari rounding bug, Bootstrap uses a 0.02px difference rather than 0.01px: twbs/bootstrap#25177. Perhaps that would work here?

[simevidas]

The WebKit bug has been fixed in Safari 15.4 a few months ago:

https://bugs.webkit.org/show_bug.cgi?id=178261