Image distributed on two pages with Firefox

[fkohrt]

Firefox 79 may distribute images on two pages (screenshot from print preview of oldstyle.html):

Is this something that can be remedied by the Gutenberg framework?

[BafS]

Thanks for the feedback, indeed it seems to be an issue with Firefox (see https://bugzilla.mozilla.org/show_bug.cgi?id=1109275).

One workaround is to use the new avoid-break-inside utility to wrap the image

<div class="avoid-break-inside">
    <img src="gutenberg.png" />
</div>

or to simply add display: inline-block to images.

I may change the behavior in a next release but I'm not exactly sure what is the right behavior in this case and how browsers will implement it. See https://drafts.csswg.org/css-break/#propdef-break-inside.

[fkohrt]

I've recently been using paged.js to create printable documents (using Hugo and the pagedjs-hugo theme component) and had no issues with images being split across pages. Maybe their implementation can provide some insight...