Is it possible to move text which is occuring after a image, above the image when the image gets page breaked? Otherwise the is a huge gap. Alternatively some lines above the image could be moved to the next page so the image doesn't have to be moved (but I guess thats more complicated).
Forum › How do I...?
Move text above image which is moved to next page coz of page-break-inside: avoid
You can float the image to the top or bottom of the page, with "float: top" or "float: bottom". You can also float it to the nearest side of the page, with "float: snap".
Thanks for your reply but "display:block; float:snap" applied to the image did not help. I appended out.pdf to make my goal clear. I want to have: "As the header ..." before the first image as the image gets pushed to the next page and leaves a big gap.
Oh, I see. That's a bit tricky. Probably "float: bottom" would be closest to what you want, although not exactly what you want, as it won't leave the image where it is if it happens to appear in the middle of the page.
Yes 'a bit tricky' fits 
There would be needed something like:
1. Oh I moved an image half the image down to the next page, coz of page-break: avoid
2. So I can try to fill space of half an image size with different content
3. Which content comes after the image?
4. Fill space with content until space is filled or an element with an css property like "do-not-use-this-element-to-fill-space" is found.
I think in another post you wrote something about an javascript api for modifing content just before it is printed to pdf. Do you think I could use this one with my problem?
There would be needed something like:
1. Oh I moved an image half the image down to the next page, coz of page-break: avoid
2. So I can try to fill space of half an image size with different content
3. Which content comes after the image?
4. Fill space with content until space is filled or an element with an css property like "do-not-use-this-element-to-fill-space" is found.
I think in another post you wrote something about an javascript api for modifing content just before it is printed to pdf. Do you think I could use this one with my problem?
This is getting beyond what Prince (and CSS!) can express at the moment. 
There is a new box tracking API, but it can't modify content, only see where the content was placed on the page. Then you need to update CSS and regenerate the PDF. So for this example, it would be a lot of work to get right.
There is a new box tracking API, but it can't modify content, only see where the content was placed on the page. Then you need to update CSS and regenerate the PDF. So for this example, it would be a lot of work to get right.
All right, luckily I just had to write a short report for my university. So I simply tweaked the images in question by hand. Thanks for you support.