Autoprefixer: break-inside for modern firefox

Created on 19 Jan 2018  ·  7Comments  ·  Source: postcss/autoprefixer

break-inside not prefixed with page-break-inside for last 2 Firefox versions or Firefox >= 52 configs
For Firefox 51 config page-break-inside adds correctly.

break-inside not supported in any version of Firefox
https://developer.mozilla.org/ru/docs/Web/CSS/break-inside

support

All 7 comments

It happened because Can I Use data changed.

I really think to remove page-break-inside from Autoprefixer since it never was a vendor prefix, just a hack/polyfill.

Maybe you should write custom PostCSS plugin. It is really easy. I think it will be just 10 LOC Anand I will help you with it. What do you think?

Removing it will break backward compatibility for Firefox users.
page-break-inside is not a prefix, but an alias for break-inside, so I think it's fine to handle it with Autoprefixer

Honestly, I think Autoprefixer should allow writing modern CSS syntax without bothering of old/unsupported browsers and without adding other PostCSS plugins like cssnext, cssnext should be about future CSS syntax. That's why I did not like moving overflow-wrap\word-wrap to cssnext from Autoprefixer. But it is just my opinion :)

Removing it will break backward compatibility for Firefox users.

Yeap. I can do it only in major version :(.

Honestly, I think Autoprefixer should allow writing modern CSS syntax without bothering of old/unsupported browsers

Autoprefixer is “not a polyfill” by design and by name ;).

page-break-inside is not a prefix, but an alias for break-inside, so I think it's fine to handle it with Autoprefixer

I got opposite advice about break-inside. Somebody told me that break-inside != page-break-inside. Can you make some research? Maybe I will change my opinion about this property.

break- properties is like 3-in-1 for page-break-, column-break- and region-break-
(meanwhile column-break- exists only as -webkit-column-break- and region-break is not existent)

So when you write break-inside: avoid it should work as combination of page-break-inside: avoid + column-break-inside: avoid + region-break-inside: avoid

But with break- you can specify what type of break do you want:
break-inside: avoid-column should work as column-break-inside: avoid
break-after: page should work as page-break-after: always

After many hours of thinking I decided to remove break-*page-break-* for Firefox since it is not a prefix e1853af

I know that you love this feature, so I am sorry. But consistency is very important.

Also, there is a good project of “writing future CSS today”. It is postcss-preset-env. Just ask them to add break-* support. It will be much better place for polyfills and same things.

postcss-preset-env is exactly what i need, can you please add it to the "Does it add polyfills?" readme section?

Was this page helpful?
0 / 5 - 0 ratings