Open shaylinko30 opened 3 months ago
There’s a draft of an ::nth-fragment()
pseudo-element selector in css-overflow-5 (https://drafts.csswg.org/css-overflow-5/#fragment-pseudo-element).
I asked for the same thing, and found out that it was already in a spec :)
https://github.com/w3c/csswg-drafts/issues/7517
Only properties that apply to ::first-letter
will have an effect when ::nth-fragment()
is used as part the selector other than as a subject. As a result, it won’t be straightforward to change the text, but you can change font-properties or opacity.
The use case here seems to be different to the one outlined in #7517. It asks for a way to alter the contents of the <thead>
element, which is duplicated on individual pages, not to style individual fragments of the table differently.
I'm not sure whether the duplication of the <thead>
is currently magic or there is already a way to control that.
Though I assume a new pseudo-element targetting duplicated table headers that allows to change the text using the content
property might make sense for that case.
Sebastian
Thank you, I didn't search the closed issues or see the draft, apologies.
I have tried to find a way to control the <thead>
s that are duplicated, but I have only been able to find solutions that require specific packages and javascript. Unfortunately for me, I only have access to CSS when rendering the PDF.
I have had a difficult time finding information about duplicated <thead>
s. It was suggested to me that the problem could be solved with an nth fragment selector, but from what you wrote @SebastianZ are the duplicated<thead>
s not fragments?
Should I update this issue to request a new pseudo-element (or pseudo-class?) to target duplicated table elements?
I'm not sure whether the duplication of the
<thead>
is currently magic or there is already a way to control that.I have had a difficult time finding information about duplicated
<thead>
s.
The answer lies in the definition of the table-header-group
value for display
in the CSS 2 spec.:
Print user agents may repeat header rows on each page spanned by a table.
It was suggested to me that the problem could be solved with an nth fragment selector, but from what you wrote @SebastianZ are the duplicated
<thead>
s not fragments?
Fragments are defined as parts of a box in relation to overflow. The duplicated <thead>
s don't fall under that definition as they are content duplications and not parts of an element. Though the specs currently don't seem to have a more detailed definition of those duplicated contents as the one I quoted above. Though it looks like issue 20 in the Overflow 5 Module is asking for a clarification on that.
Though the spec. also currently says this:
Styling an
::nth-fragment()
pseudo-element with thecontent
property has no effect; the computed value of content for the fragment box remains the same as the computed value of content for the element.
So I see two options to cover the use case of changing the contents of <thead>
elements for each page:
::nth-fragment()
. At the same time, relax the definition of ::nth-fragment()
so that content
has an effect in this case.An+B
, like for ::nth-fragment()
to target the nth duplicate.Sebastian
Should I update this issue to request a new pseudo-element (or pseudo-class?) to target duplicated table elements?
I've done that for you. I've described the use case instead focusing on the syntax to avoid any early restrictions in discussions.
Sebastian
@frivoal @FremyCompany @tabatkins @fantasai Maybe you could provide some input here as the authors of the related specs.
Sebastian
While this seems valuable, I think there is a lack of interop to enable this type of use case as of now.
Is there interest from any vendor to explore this at the moment? @bfgeek @emilio @fantasai
I was directed to this repo in order to make a request for an nth fragment selector.
The problem I am trying to solve is to be able to select and update the CSS of tables split across PDF pages. For example, I would like the table thead on the first PDF page to say 'Reviews' and the table thead on the following PDF pages to say 'Reviews continued'.
I thought I might be able to use the :not(:first-child) selector so that every table thead not on the first page would have the text 'Reviews continued'. But it seems that the tables on the subsequent pages are fragments, not children.
I would like to request an nth fragment css selector if appropriate.