I have a weird situation here:

Apparently for no reason, some content is more narrow than the rest. Or to be more exact: some content is shifted to the right. It appears to be the body margin (20mm) doubled on the left.

I've put a debug style in my print CSS:

body {
    border-left: 1px solid red;
    border-right: 1px solid red;
}

I'm not new to writing CSS for print. There is nothing in the styles of those affected elements that could cause this.

In Chrome print preview, everything looks alright.

Another annoying issue is that footers are missing for apparently no reason.

Are there any known bugs / scenarios that causes such a behavior? I can post code and files if needed.

For now, only screenshots:
pages 9-10: body-margins OK, but no footer
pages 11-12: body margin left too big, but footers appear
pages 19-20: body-margins OK, but again no footers

What's not 100% clear to me: What is the correct or preferred way to define page margins? via regular body CSS, or via @page ?

1. page-11-12.jpg‎ 152.2 kB
2. page-19-20.jpg‎ 249.6 kB
3. page-9-10.jpg‎ 215.5 kB

(blank)

Edited 3 Mar 2023 by howcome

Could you post the source code? Preferably in a minimized version, without external dependencies.

I prefer to set page margins with @page, and nulling margin/padding on html/body. E.g. like this:

@page {
   size: a4 portrait;
   margin: 20mm;
}
html, body { margin: 0; padding: 0 }