Re: [csswg-drafts] [css-overflow-5] Giving ::scroll-marker-group a name (and optionally text) (#12176)

The CSS Working Group just discussed `[css-overflow-5] Giving ::scroll-marker-group a name (and optionally text)`.

<details><summary>The full IRC log of that discussion</summary>
&lt;JoshT> flackr: when using CSS scroll markers, we implicitly create a ::scroll-marker-group<br>
&lt;JoshT> ... for presentation and a11y tree, the element doesn't have a name to say what type of thing it's containing. maybe slides or pages or items<br>
&lt;JoshT> ... it's good practice and visually desirable to have a label<br>
&lt;JoshT> ... I wanted to get some consensus on what path we should follow here<br>
&lt;JoshT> ... i listed possible options.<br>
&lt;JoshT> ... without major syntactic changes, we could add the content before the pseudo on the scroll-marker-group<br>
&lt;JoshT> ... but wanted to get group's thoughts<br>
&lt;astearns> ack fantasai<br>
&lt;TabAtkins> q+<br>
&lt;JoshT> fantasai: when you're at the point where you need labels, you should probably use HTML<br>
&lt;astearns> +1 fantasai<br>
&lt;JoshT> ... when this was just a decorative thing, that seemed like it could be in css.<br>
&lt;JoshT> ... once it has content, it seems like it needs to be in the content<br>
&lt;astearns> ack TabAtkins<br>
&lt;JoshT> TabAtkins: I disagree with fantasai<br>
&lt;astearns> q+<br>
&lt;JoshT> ... we already have the alt property to add alt text before and after<br>
&lt;JoshT> ... we encourage adding content in the dom<br>
&lt;JoshT> ... but this labelling serves the same purpose<br>
&lt;JoshT> ... this might only apply in certain media queries and therefore be stylistic<br>
&lt;JoshT> q+<br>
&lt;PaulG> q+<br>
&lt;JoshT> ... I think simply labelling things is appropriate<br>
&lt;florian> q+<br>
&lt;TabAtkins> s/before and after/to ::before and ::after/<br>
&lt;JoshT> astearns: while I agree with the alt text comparison, I wonder if it's just that sort of thing. is there anywhere else in CSS where we apply an aria-label<br>
&lt;JoshT> flackr: this is wherever the content property applies<br>
&lt;JoshT> astearns: is it a label or more like a role?<br>
&lt;JoshT> ... do we need ways of setting roles for a11y affordances?<br>
&lt;astearns> ack astearns<br>
&lt;astearns> ack PaulG<br>
&lt;JoshT> PaulG: the examples of tabs would be a tab list and not just a group<br>
&lt;JoshT> ... so there are different roles for different collections of items<br>
&lt;JoshT> ... content is also problematic for accessibility, like with translations<br>
&lt;JoshT> ... so we tell people to avoid it<br>
&lt;JoshT> ... there are multiple issues. could we see examples with the role?<br>
&lt;JoshT> ... I suspect it will get complicated without a lot more hinting<br>
&lt;JoshT> flackr: this is not about setting the role. aria has examples of using a tablist role with a label<br>
&lt;JoshT> ... this is just a label that is a friendly name for the user to explain it. we are exploring changing  tablist roles with a different property in a different issue<br>
&lt;JoshT> ... this would be similar to the aria-label property<br>
&lt;astearns> ack JoshT<br>
&lt;TabAtkins> JoshT: haven't read the issue yet, but TAG recently got back to you about this<br>
&lt;TabAtkins> JoshT: anything they mentioned that is relevant to this?<br>
&lt;TabAtkins> flackr: this specifically, not sure. tabs-or-links resolution from the other issue (about changing the role and interaction behavior) was directly in relation to some of the TAG feedback<br>
&lt;TabAtkins> flackr: I think this might have come up a bit as well. i'm trying to align the things that you should do to make your site a11y aligned, as easy as possible<br>
&lt;TabAtkins> flackr: so being able to give a more contextually meaningful label seemed like a nice thing for devs to be easy to do<br>
&lt;astearns> ack florian<br>
&lt;JoshT> florian: This is a passing thought. whether this should be done in CSS or HTML...<br>
&lt;JoshT> ... this seems like another case for cascading attributes<br>
&lt;keithamus> q+<br>
&lt;JoshT> TabAtkins: I don't think that's the case here. these are CSS generated and that would only work if you have the markup<br>
&lt;fantasai> +1 to cascading attribute sheets being useful for many of these kinds of cases, and also probably not relevant to this case<br>
&lt;JoshT> florian: so it's adjacent but not quite right<br>
&lt;astearns> ack keithamus<br>
&lt;JoshT> keithamus: Concerned about the recurring theme with scroll markers. The question of why it isn't in HTML.<br>
&lt;JoshT> ... this is the case again. If you supply a label with CSS for scroll makers, why not every element?<br>
&lt;JoshT> ... does the aria spec need to be updated to mention stuff about CSS?<br>
&lt;JoshT> ... does the a11y tree get more complex as a result?<br>
&lt;JoshT> flackr: you can already set a content value<br>
&lt;JoshT> keithamus: that's limited in scope<br>
&lt;JoshT> ... one property on pseudo-elements. this isn't a suggestion to allow content in a pseudo-element<br>
&lt;JoshT> flackr: this is<br>
&lt;JoshT> astearns: well in three of your four options<br>
&lt;PaulG> CSS pseudo element content, either :before or :after, must only be used for decorative purposes. If you insert meaningful content using a :before or :after pseudo element, it is in violation of success criteria 1.3.1.<br>
&lt;JoshT> flackr: yes. we have a pseudo-element and we want to give it pseudo-content<br>
&lt;PaulG> arguing that this is the same thing, is going to cause issues<br>
&lt;JoshT> astearns: as PaulG mentioned, the a11y folks don't like us doing that<br>
&lt;ntim> q+<br>
&lt;JoshT> ... I wonder, should we take the issue back to consider whether the use case should be addressed in HTML?<br>
&lt;JoshT> TabAtkins: I think your question is, 'should we be doing scroll markers in css at all?'<br>
&lt;JoshT> ... I don't know what is the more specific use case you might be targeting?<br>
&lt;JoshT> ... how could we do that in markup without the whole thing being in markup<br>
&lt;JoshT> PaulG: you could point to an element with content in it<br>
&lt;kizu> q+<br>
&lt;florian> q+<br>
&lt;JoshT> ntim: Keith's question is legit<br>
&lt;JoshT> ... we had discussions about adding event listeners onto the elements, and now labels<br>
&lt;JoshT> ... will we end up needing slotting inside pseudo-elements?<br>
&lt;JoshT> ... I think a boundary makes sense. we need to find a boundary<br>
&lt;fantasai> +1 to figuring out where the boundary is<br>
&lt;JoshT> kizu: someone mentioned on one of the threads about whether we can connect a HTML template to a pseudo-element<br>
&lt;JoshT> ... let's say we have a pseudo-element that provides something as content<br>
&lt;JoshT> ... then define the template in HTML which can be translated<br>
&lt;JoshT> ... one common case is adding icons. or adding more complex content<br>
&lt;keithamus> q+<br>
&lt;JoshT> ... something we never did before but could be explored<br>
&lt;JoshT> ... and could be dynamic<br>
&lt;JoshT> florian: on the HTML vs CSS discussion, it feels CSSy still. this is the presentation, not the content of the document<br>
&lt;JoshT> ... so having the whole thing or a chunk in CSS does make sense<br>
&lt;JoshT> ... if we have building blocks on both sides, that may work too. this is not pure content<br>
&lt;JoshT> ... I'm kind of sorry I pushed the discussion in that direction<br>
&lt;JoshT> ... are we going into abstract theoretical purity things<br>
&lt;TabAtkins> +1<br>
&lt;JoshT> ... but if this helps us find a better path, maybe that's right<br>
&lt;JoshT> keithamus: I don't think it's too abstract. I would have also raised it<br>
&lt;JoshT> ... there are common problems here with solutions today in HTML<br>
&lt;JoshT> ... the scroll-marker-group, is there more than one?<br>
&lt;JoshT> flackr: no<br>
&lt;JoshT> keithamus: so this could be a slotted element<br>
&lt;JoshT> ... it could be supplied to you if you want it fully decorated. but if you want to change the role or whatever, you could add a new HTML element into your container and that acts as the element that is slotted in<br>
&lt;florian> q+<br>
&lt;JoshT> ... it would be just like ::detail-summary. that would point to the detailed content of the summary<br>
&lt;ntim> (::details-summary does not exist anymore, ::details-content does though)<br>
&lt;JoshT> ... I think scroll markers could also fit that pattern<br>
&lt;JoshT> ... I think it solves the general problems that this design is pointing towards<br>
&lt;JoshT> florian: I am unsure. yes somewhat, but it bakes into the markup assumptions about how we will generate the whole thing which is a smell as well<br>
&lt;JoshT> keithamus: I guess I'm curious what presentation assumptions having an element in the dom makes<br>
&lt;JoshT> florian: maybe I misunderstood what you meant, but depending on when you use scroll-marker or -group at all, you might not need that element<br>
&lt;JoshT> ... you may have completely different presentation of the content that doesn't need these things at all<br>
&lt;JoshT> ... but if you do need them and they're not baked into the markup, you can't<br>
&lt;JoshT> ... or otherwise you have it and you need to adjust your markup<br>
&lt;florian> s/will generate/will present/<br>
&lt;JoshT> TabAtkins: this is related to how most UI frameworks have a container type.<br>
&lt;JoshT> ... in CSS, it is purely presentational and you can turn it off<br>
&lt;JoshT> ... that's the idea here too, where a styling choice can affect whether you have scroll markers<br>
&lt;JoshT> ... it is theoretically possible to have a pattern in HTML that has scroll markers<br>
&lt;JoshT> ... if it is something that can optionally generate scroll makers, then the presence/absence of it is CSS dependent<br>
&lt;JoshT> ... most of the questions like architectural decisions are the same<br>
&lt;JoshT> ... we're trying to avoid the situation where if we were to add markup for scroll markers, that would automatically do scroll makery stuff and you can't meaningfully turn it off<br>
&lt;JoshT> keithamus: we can have different semantics here. we could make it conditional even based on UA styling<br>
&lt;florian> q+<br>
&lt;JoshT> ... and that will make it affect the a11y tree<br>
&lt;JoshT> ... I'm concerned that we're extending this concept in ways that will create more burdens when we could just have an element on the page and influence the a11y tree normally<br>
&lt;JoshT> ... if someone wants to change any property for it, the solution already exists<br>
&lt;JoshT> fantasai: there are a number of scroll markery things we don't expect to generate in CSS. like a ToC where the content of the heading is the link. that would need to be done in the HTML<br>
&lt;JoshT> ... there is a set of use cases for scroll markers that we've already decided belong in HTML<br>
&lt;JoshT> ... I think going back to ntim's question, where do we draw the line for what use cases are in HTML?<br>
&lt;JoshT> florian: there is a tension here about what is a natural fit for the capabilities of the language<br>
&lt;JoshT> ... what is an appropriate decoupling of content and CSS?<br>
&lt;JoshT> ... they are overlapping<br>
&lt;JoshT> ... I maybe lean towards decoupling with presentational things being in CSS more often than not<br>
&lt;JoshT> ... it's presentationy and you may want to turn them off or on<br>
&lt;JoshT> fantasai: to the extent that the more something is coupled with the content, the more it belongs in HTML<br>
&lt;JoshT> ... also, would be useful if this issue had more concrete examples of what we mean by a tablist. they're normally labelled with something<br>
&lt;JoshT> ... that would be useful.<br>
&lt;JoshT> ... and we don't seem to have a consensus here. we should probably move on<br>
&lt;JoshT> flackr: I think that's fine to wrap up.<br>
&lt;flackr> https://github.com/w3c/csswg-drafts/issues/8892<br>
&lt;JoshT> ... I want to point out there's a similar issue for selecting content from pseudo-elements<br>
&lt;JoshT> ... I think part of this is dev ergonomics<br>
&lt;JoshT> ... I can try to distill this down. I don't know if we're getting anywhere but can bring back to issue<br>
&lt;JoshT> ... it's basically just a label for your scroll markers. I can put examples in the issue<br>
&lt;JoshT> florian: it may help focus<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12176#issuecomment-3250008793 using your GitHub account


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

Received on Wednesday, 3 September 2025 16:49:18 UTC