Text content is overlapping when there are too many text
Hello,
I have PDFs with long text contents and when that happens, after a page break, text overlap with some other text. I'm attaching a PDF + HTML so you can replicate with the latest version of prince.
Check the last page on the attached PDF
- Screen Shot 2022-07-04 at 15.06.30.png 1.0 MB
- test-overlap.pdf 23.5 kB
- test.html 38.6 kB
The attached test involves flexbox. Size calculations in the css-flexbox spec were written without considering pagination or multicol, and what you see in this example is a result of that. This is a known problem and there has been some work towards changing the flexbox spec to account for this, but this will take time.
Can the original document be changed to reduce its use of column flex containers, changing them either to simple block layout or table layout?
E.g. in the case of test.html itself, changing .css-j632zo-GroupedBlock and .css-foy67s-Stack from column flex containers to simply display:block makes it display as expected: it happens that these flex containers aren't actually using any feature of flex layout that isn't available in plain block layout.
Whereas if the original non-test document has any column flex container whose size is not determined solely by its content, and wants to distribute the extra space anywhere but at the end of the column, then the question is how much space to add, which isn't known until you know the heights of the remaining items, which in turn depend on how much space you add before them, and that's where the challenge comes in how to adapt the flexbox spec to account for fragmentation (pagination or multicol).
Hi,
This isn't quite the full answer as we do have a heuristic solution that addresses this problem. We've found that it works well for cases we've seen so far, so thanks for posting this example where it fails! It will help us make improvements.
Mark
Thank you all! Changing to block layout solved the issue, but it'd be amazing if we can use flexbox in these situations, because we won't be able to use the block layout in all cases.
