[csswg-drafts] Dynamic backsides for print layout? (#13700)

Psychpsyo has just created a new issue for https://github.com/w3c/csswg-drafts:

== Dynamic backsides for print layout? ==
**Problem Description / Use Case:**
I think there is currently no way to print a website and insert some form of a dynamic backside on every second page.
I ran into this when writing [a library to print playing cards](https://github.com/Psychpsyo/cardPrinterJS) from within the browser. Making a grid of cards flow dynamically into whatever size pages, fitting as many cards per page as possible was straight-forward and is much nicer than providing some form of PDF download for printing that would only really support one paper size.
But ideally, it'd be possible to set things up in such a way that every second page is filled with the back faces for the cards on the previous page, so that each sheet of paper can just be run through the printer twice. I feel like there might also be some other types of printed content that could make use of something like this, thought I can't think of any concrete examples right now.

**Solutions(?):**
I'm having a hard time even coming up with a sensible API that could do this.
So I'll just put some vague ideas here:

1. Counters
One could imagine incrementing a counter on each card and, at each page boundary, inserting generated content (like an `::after`) that has X images inside of it, where X is the current value of the counter. Then the counter gets reset. Could be a use-case for #1026, but can't print different backsides per card. Backsides also wouldn't exist in the page itself.

2. Alternating Pages
Currently it is possible to lay out all the backsides after all the frontsides of the cards. The problem with this is that it's hard to tell when one is done printing all the front sides, to then run all the pages through the printer again, the other way around. If there was some way to orchestrate the print mode in a way where it is able to interleave these pages instead, so that a backside page gets printed after each frontside page, this would be possible.

3. Regions
If there was something like CSS regions, one could imagine setting up a bunch of regions which are sized to a height of `100vh` and alternate between having the backsides and frontsides flowed into them. The problem is that you wouldn't know how many regions you need before printing. (since the actual amount of cards per page changes depending on the available paper sizes and such)
One could imagine expanding grid layout's `grid-row` and `grid-column` to support values of the form `An+B`, similar to `:nth()`. If this makes a grid item go into discontinuous grid cells, it would fragment. Though this would also enable things like L-shaped regions which might be an issue.

4. JavaScript API
One could imagine a JavaScript API that allows more granular control over what content is printed and the order that pages are arranged in. This could enable laying out the front and backsides in two separate elements and then printing those two elements in an interleaved fashion. The upside of this is that content can be printed without having to replace the entire document with the content to be printing, which would solve another annoyance that my library currently has to work around. (then again, one could use an iframe for that)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13700 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Sunday, 22 March 2026 00:36:29 UTC