Late to the baseline: @page

Bookmark this under »funny news«, but 13 years after this css feature was added to Chrome Version 15, it was rolled out for Safari and mobile Safari Version 18.2 in December ’24 and is now considered as widely available aka. »baseline 2024«. The @page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides. I know, you are using it since years, but now it has some effect, even if someone prints your document from his iPhone.

Just to bring back to memory, what can be done with @page (inspired by the mdn article):

/* Targets all pages */
@page {
    margin: 2cm;
}

/* Targets even-numbered pages */
@page :left {
    margin: 2cm 2cm 2cm 4cm;
}

/* Targets odd-numbered pages */
@page :right {
    margin: 4cm 2cm 2cm;
}

@page {
  /* margin box at top right showing page number */
  @top-right {
    content: "Page " counter(pageNumber);
  }
}