dompdf / dompdf

HTML to PDF converter for PHP
https://dompdf.github.io/
GNU Lesser General Public License v2.1
10.54k stars 1.8k forks source link

Bold text exceeding page boundaries #1052

Closed Finalfantasykid closed 3 years ago

Finalfantasykid commented 9 years ago

If there is bold text which would normally wrap to the first line of a new page, it instead continues on the same page, but over the page boundaries. This also affects italic, underline text (and probably anything else like span...) Here is some sample input which shows this behavior:

<html>
<head>
<style>

body {
    font-size: 15pt;
}

</style>
</head>

<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sollicitudin dapibus neque, et rhoncus ex faucibus eget. Nam ultricies vulputate lectus, ut placerat neque mattis sed. Nunc at congue tortor. Cras convallis aliquam dui, sit amet ornare urna iaculis eget. Nullam facilisis ipsum in sodales porttitor. In arcu lectus, consectetur ultrices scelerisque et, aliquam nec arcu. Suspendisse suscipit tincidunt tristique. Aliquam vel lacus tincidunt lectus sagittis feugiat. Sed elementum quam at lectus volutpat, quis convallis sapien imperdiet.<br />
<br />
Maecenas scelerisque lectus augue, a bibendum elit sagittis eget. Sed at sapien ultricies, dignissim dui vel, gravida risus. Vivamus tempor mi vitae nunc luctus, sed consectetur ligula lacinia. Ut convallis suscipit elementum. Sed consectetur sagittis ipsum, ac laoreet mi dapibus in. In suscipit malesuada ligula, a convallis turpis euismod ac. Maecenas ultricies est nec lacus luctus, sit amet mattis sapien commodo. Etiam ante sapien, volutpat ullamcorper venenatis vitae, ornare id leo. Proin magna ipsum, pulvinar ut felis sit amet, efficitur rhoncus massa. Pellentesque finibus lobortis sollicitudin.<br />
<br />
Nunc pulvinar est eget quam faucibus bibendum. Ut a imperdiet est. Morbi commodo libero sed nisi laoreet lacinia. Sed consequat, dui nec fringilla sagittis, neque sem semper mi, at pulvinar lectus nisi quis purus. Pellentesque convallis interdum lectus nec pretium. Vestibulum a venenatis quam, non tempus nisl. Nunc accumsan maximus elementum. Pellentesque ut efficitur erat. Donec pellentesque pulvinar justo, semper dignissim neque vestibulum at. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis accumsan odio id neque condimentum, id tincidunt orci euismod.<br />
<br />
Morbi vitae leo nunc. Fusce vitae turpis rutrum, accumsan enim eget, eleifend mi. Fusce magna lacus, sollicitudin quis sem vitae, aliquet volutpat turpis. Donec ac dignissim ex. Donec faucibus ipsum sit amet est congue pellentesque. Phasellus ultricies ut tellus quis euismod. Quisque metus felis, pellentesque id eleifend vel, egestas at lorem. Etiam varius hendrerit urna, consequat egestas nulla bibendum convallis. Pellentesque a finibus lorem. Phasellus non velit eu dui pretium maximus. Vestibulum accumsan nibh sit amet urna interdum, quis malesuada eros egestas.<br />
<br />
Sed a arcu eget ipsum aliquam imperdiet. Nullam eget ante commodo, pulvinar metus a, pharetra diam. Integer eleifend lectus magna, ac ullamcorper odio tincidunt dictum. Aliquam quis tempus arcu, ut interdum neque. Ut rhoncus faucibus tortor, ut tincidunt justo. Pellentesque congue ante quis varius sagittis. Sed placerat semper ligula sed porta. Phasellus tincidunt, ante sit amet mollis rutrum, dui ipsum venenatis est, sed cursus diam leo id ligula. Curabitur vulputate nisl et consectetur fermentum. Donec elementum metus dolor, sit amet sodales neque rhoncus at. Ut commodo, mi in hendrerit sodales, eros eros tempus purus, a pellentesque tortor nulla eget orci. Mauris vel enim justo. Proin sit amet lectus porta nunc tempor dictum id eget felis. Sed condimentum mi efficitur, mattis eros et, finibus mauris.  <b>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b> Mauris sollicitudin dapibus neque, et rhoncus ex faucibus eget. Nam ultricies vulputate lectus, ut placerat neque mattis sed. Nunc at congue tortor. Cras convallis aliquam dui, sit amet ornare urna iaculis eget. Nullam facilisis ipsum in sodales porttitor. In arcu lectus, consectetur ultrices scelerisque et, aliquam nec arcu. Suspendisse suscipit tincidunt tristique. Aliquam vel lacus tincidunt lectus sagittis feugiat. Sed elementum quam at lectus volutpat, quis convallis sapien imperdiet.<br />
</body>
</html>

If you unbold the text in the last paragraph, it renders correctly. I have tried several workarounds like splitting the bolded text so that each word in the phrase is bolded separately, but that also has a similar problem to occur. I have not tried the 0.7 beta yet, I'll see if that has fixed the issue. I am using 0.6.1

Update: I tested with 0.7 beta2 and the same problem exists

bsweeney commented 9 years ago

I'm not seeing the same issue. The sample you posted is exhibiting the issue? Are you using the CPDF back end? Anything else that could help reproduce?

Finalfantasykid commented 9 years ago

Maybe try this one. I wasn't using some of the defaults, so the bold text might not have been at the page break.

<html>
<head>
<style>

@page {
    margin-top: 0.5cm;
    margin-right: 0.5cm;
    margin-bottom: 0.5cm;
    margin-left: 0.5cm;
}

body {
    font-size: 15pt;
}

</style>
</head>

<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sollicitudin dapibus neque, et rhoncus ex faucibus eget. Nam ultricies vulputate lectus, ut placerat neque mattis sed. Nunc at congue tortor. Cras convallis aliquam dui, sit amet ornare urna iaculis eget. Nullam facilisis ipsum in sodales porttitor. In arcu lectus, consectetur ultrices scelerisque et, aliquam nec arcu. Suspendisse suscipit tincidunt tristique. Aliquam vel lacus tincidunt lectus sagittis feugiat. Sed elementum quam at lectus volutpat, quis convallis sapien imperdiet.<br />
<br />
Maecenas scelerisque lectus augue, a bibendum elit sagittis eget. Sed at sapien ultricies, dignissim dui vel, gravida risus. Vivamus tempor mi vitae nunc luctus, sed consectetur ligula lacinia. Ut convallis suscipit elementum. Sed consectetur sagittis ipsum, ac laoreet mi dapibus in. In suscipit malesuada ligula, a convallis turpis euismod ac. Maecenas ultricies est nec lacus luctus, sit amet mattis sapien commodo. Etiam ante sapien, volutpat ullamcorper venenatis vitae, ornare id leo. Proin magna ipsum, pulvinar ut felis sit amet, efficitur rhoncus massa. Pellentesque finibus lobortis sollicitudin.<br />
<br />
Nunc pulvinar est eget quam faucibus bibendum. Ut a imperdiet est. Morbi commodo libero sed nisi laoreet lacinia. Sed consequat, dui nec fringilla sagittis, neque sem semper mi, at pulvinar lectus nisi quis purus. Pellentesque convallis interdum lectus nec pretium. Vestibulum a venenatis quam, non tempus nisl. Nunc accumsan maximus elementum. Pellentesque ut efficitur erat. Donec pellentesque pulvinar justo, semper dignissim neque vestibulum at. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis accumsan odio id neque condimentum, id tincidunt orci euismod.<br />
<br />
Morbi vitae leo nunc. Fusce vitae turpis rutrum, accumsan enim eget, eleifend mi. Fusce magna lacus, sollicitudin quis sem vitae, aliquet volutpat turpis. Donec ac dignissim ex. Donec faucibus ipsum sit amet est congue pellentesque. Phasellus ultricies ut tellus quis euismod. Quisque metus felis, pellentesque id eleifend vel, egestas at lorem. Etiam varius hendrerit urna, consequat egestas nulla bibendum convallis. Pellentesque a finibus lorem. Phasellus non velit eu dui pretium maximus. Vestibulum accumsan nibh sit amet urna interdum, quis malesuada eros egestas.<br />
<br />
Sed a arcu eget ipsum aliquam imperdiet. Nullam eget ante commodo, pulvinar metus a, pharetra diam. Integer eleifend lectus magna, ac ullamcorper odio tincidunt dictum. Aliquam quis tempus arcu, ut interdum neque. Ut rhoncus faucibus tortor, ut tincidunt justo. Pellentesque congue ante quis varius sagittis. Sed placerat semper ligula sed porta. Phasellus tincidunt, ante sit amet mollis rutrum, dui ipsum venenatis est, sed cursus diam leo id ligula. Curabitur vulputate nisl et consectetur fermentum. Donec elementum metus dolor, sit amet sodales neque rhoncus at. Ut commodo, mi in hendrerit sodales, eros eros tempus purus, a pellentesque tortor nulla eget orci. Mauris vel enim justo. Proin sit amet lectus porta nunc tempor dictum id eget felis. Sed condimentum mi efficitur, mattis eros et, finibus mauris.  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sollicitudin dapibus neque, et rhoncus ex faucibus eget. Nam ultricies vulputate lectus, ut placerat neque mattis sed. Nunc at congue tortor. <b>Cras convallis aliquam dui, sit amet ornare urna iaculis eget.</b> Nullam facilisis ipsum in sodales porttitor. In arcu lectus, consectetur ultrices scelerisque et, aliquam nec arcu. Suspendisse suscipit tincidunt tristique. Aliquam vel lacus tincidunt lectus sagittis feugiat. Sed elementum quam at lectus volutpat, quis convallis sapien imperdiet.<br />
</body>
</html>

Looks like: selection_033 Notice how the bold text goes to the next line on the same page, while it should have gone to the next page. The text after the bold correctly goes to the next page.

What it should look like is: selection_034

This is a problem for my case because I have a line drawn at the bottom of each page with a "Page x of y" and if there is any bold text as the last line on the page which wraps, then it overlaps the line.

bsweeney commented 9 years ago

Sorry, my mistake. I was looking at it incorrectly. There is indeed an issue.

The problem is more pronounced if you do not have a block element around the document content, in which case the content runs to the edge of the page. If you surround the content with a block element there will at least be a little space between it and the bottom of the page.

And, yes, it does look like any inline element will cause an overflow. Easiest way to tell is to just bold the entire paragraph.

Finalfantasykid commented 9 years ago

Do you know where the problem might be occuring? I can probably fiddle around with the source code if I know where the problem would most likely be happening.

sabat24 commented 8 years ago

I've got the same problem with inline elements and text overriding my footer. I've got main content wrapped in one div element, but it changes nothing.

bsweeney commented 8 years ago

@Finalfantasykid sorry I hadn't responded. I do not yet know where the problem is occurring. If I were to guess I'd start looking in the inline frame reflower. These methods look to the containing block to understand the boundaries.

@sabat24 your issue might be different. You have to place headers/footers outside the page margins so that the page content does not overlap it.

sabat24 commented 8 years ago

@bsweeney I've placed footers outside the page. I generate documents with15 - 20 pages with page breaks and on some pages everything worked fine (content and footer was nicely separated) and on the others not. However since 0.6.2 setting bottom margin of the content's container higher than I actually need solves the problem. On some pages text ends earlier than he could, but I can live with that :)

bsweeney commented 8 years ago

@sabat24 if you want to supply an HTML sample we can take a closer look.

Mellthas commented 3 years ago

This should be addressed now on develop with the changes to inline positioning, same as #565.