google chrome - CSS Print Sheet - Image is placed on next page, with text over it

Question

I have a page where the user can insert rich text and images (via 2 Summernote fields).

When the user print the page in Chrome, sometimes the layout is broken. Basically it seams that when there is no more space for an image on page, the image is moved to the next one (which is correct), but then the text is over the image, and then the image over the text:

(please note that text is blurred on purpose)

In this particular situations, by settings the margins to none or by shrinking the images, the green image stay on the first page and the text is displayed fine. But this is clearly a work.around for this particular example.

Is there any CSS rule that can I apply to the images in order to avoid this issue?

Answer 1

等待大神答复