CSS "break-before" (replacing "page-break-before") not supported

[KewDev23]

Hi,

I read that "page-break-before" is now replaced by "break-before" in CSS: https://css-tricks.com/almanac/properties/p/page-break/ "Note: this property is in progress of being replaced by the more generic break-before property. This new property also handles column and region breaks while being syntactically compatible with page-break-before. Thus before using page-break-before, check if you can use break-before instead."

But, currently, in react-to-print, "page-break-before" works but not "break-before". Could you support it? Thank you very much in advance.

[MatthewHerbst]

Hello. react-to-print is agnostic of the CSS you use. We do not look at your styles at all, and there is no concept of us "supporting" a certain style or not. If it doesn't work, assuming it's being used correctly, it likely means the browser you are using doesn't support what you are trying to do. See a Compatibility Table for more. Browsers do all sorts of weird things when printing so this may be the case even if there is normal support when not printing.

If you're still having trouble please feel free to post your code and we can try to help.

[KewDev23]

Thank you very much for your answer. You are right, I was using break-before: always; which is not supported for always value in Chrome while page-break-before: always; is supported since Chrome 1.0. It seems I must use break-before: page; now which is working.

Sorry for thinking it was react-to-print the cause. I thought it when I saw my CSS code removed in the Chrome inspector for an injected code in the page by react-to-print:

[MatthewHerbst]

No problem, glad you got it figured out! Please let us know if you run into any other issues