[csswg-drafts] [css-page-3] - spec gap: no way to continue page flow when using two named pages. (#11410)

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

== [css-page-3] - spec gap: no way to continue page flow when using two named pages. ==
Supposing the following css and html

```html
<main>
    <h2>Chapter Title</h2>
    <p>Enough lipsum content to fill 2.5 pages</p>
</main>
```

```css
@page typical {
   background-color: #f88
}
@page chapterhead {
   background-color: #8f8
}
main {
    page: typical;
}
h2 {
    page: chapterhead;
    break-before: page;
    break-after: avoid-page;
}
```
The objective here is to have 3 pages [chapterhead, typical, typical] where the first page is the <h2> and whatever amount of the <p> will fit on the rest of the "chapterhead" page and then run into the "typical" pages.

current spec says that this *should* result in 4 pages [chapterhead, typical, typical, typical] where <h2> exists on its own page, despite `break-after` set to `avoid-page`.

I would argue that if I wanted this I would put `page: typical` on the `p` style instead of `main` or remove the `break-after: avoid-page` from the `h2` - or something similar.

it is worth noting that if I remove `page: typical` from `main` and let it use the unnamed page, the behaviour I desire manifests, however this means you can only ever use the one unnamed page style, which limits styling potential for different major sections and the like.

Point is, there is no mechanism to allow text to continue to flow on whatever named page when another named page is used as a sections "default" (for lack of a better term).

PrinceXML seems to solve this use case by implementing a `-prince-page-group` property which can be "auto" or "start" where a value of "start" will let a page with an h2 by targeted by the `:first` pseudo-selector. [https://www.princexml.com/doc/css-props/#prop-page-group](https://www.princexml.com/doc/css-props/#prop-page-group)
for example:
```css
@page typical {
   background-color: #f88
}
@page typical:first {
   background-color: #8f8
}
main {
    page: typical;
}
h2 {
   -print-page-group: start;
}
```

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


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

Received on Monday, 23 December 2024 17:51:02 UTC