flyingsaucerproject/flyingsaucer

Left and right margin after :first page bug

jumarub opened this issue · 1 comments

Hello, good day.
As mentioned in this conversation:
link
There is an error occurring when defining margins on the first page (@page:first) and the default page (@page). The issue is that some blank margins are being generated, as shown in the attached photos. In my case, the same problem occurs. I have the following configuration, and after the first page, these blank "margins" start to appear, breaking the visibility.

I have this configuration, maybe there is something wrong with my code?

        @page :first{
            margin-top: 5mm;
            margin-left: 5mm;
            margin-bottom: 5mm;

            @bottom-right{
                content: none;
            }

            @bottom-left{
                content: none;
            }
        }

        @page {
            margin-top: 3.3cm;
            margin-left: 1.5cm;
            margin-right: 1.5cm;
            margin-bottom: 1.7cm;
           }

image

first page
Screenshot 2023-11-15 at 9 47 21 AM

second page
Screenshot 2023-11-15 at 9 47 31 AM

Sorry for the late response here. The CSS looks good to me. This is a bug, but unfortunately one that's pretty hard to fix.

Flying Saucer started life as a Java2D (screen) media CSS renderer. The paged media (PDF) support basically treats the document as an infinitely long page and slides boxes around to make pages break nicely. What's happening in your example is that <body> is getting its width set from the first page and, in turn, the <p> on the second page is taking its width from .

When the page is rendered, the content is shifted and clipped to the page's content area, hence the chopped off text.

In terms of workarounds, here are a couple:

  • Setting an explicit width on the <p> on the second page.
  • Using named pages [ https://drafts.csswg.org/css-page-3/#using-named-pages ]

Would either of those work for you?