WeasyPrint icon indicating copy to clipboard operation
WeasyPrint copied to clipboard

div margins cause bad positioning for vertical-align: bottom in page margin boxes

Open castedo opened this issue 1 year ago • 4 comments

Here is a simplified HTML example for what I believe if a bug: test.html.txt and the PDF I get with WeasyPrint 58.1: test.pdf

What I expected is for the pink rectangles in the upper page margin to be positioned similar to the pink rectangles in the lower page margin. In other words, I was expecting the pink rectangles to stay within the blue rectangles.

It seems like the inner div margin handling is correct when the page margin box is vertical-align: top (as seen in the lower page margin) but incorrect when vertical-align:bottom (as seen in the upper page margin).

The height + top + bottom margins of the pink inner divs sum to exactly to the height of the blue page margin boxes. So I see no reason for the pink inner divs to overflow.

Smells like a calculation bug.

castedo avatar May 24 '23 01:05 castedo

Surprisingly, Prince gives the same result as WeasyPrint here (except from the widths, because of #58, but that’s another story). So… I’m not sure that it’s a bug. I have to check more precisely the different specifications, and hope to find something on this particular example.

liZe avatar May 24 '23 12:05 liZe

Well, Prince and WeasyPrint have the same rendering. AntennaHouse, BFO and Typeset give the "right" rendering. I think that it’s a bug…

The problem seems to be easy to solve, but it’s not: it’s caused by collapsing margins between the running element box and its anonymous wrapper. Fun!

liZe avatar May 29 '23 17:05 liZe

Good to know, thank for looking into!

I was wondering how printstrap should handle this issue.

castedo avatar May 29 '23 17:05 castedo

I was wondering how printstrap should handle this issue.

We should fix it in WeasyPrint!

liZe avatar May 30 '23 12:05 liZe