By default, the text in a "before" or "after" generated content will be read by a screen reader, but it's often used for things like "★", which, if they were a DOM element would warrant an aria-label. Giving alternative text in the generated content directly will help people to give a better alternative, or to suppress certain decorative character Chrome seems to have shipped this: https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/nC5p6W8nM3g Issue in FireFox: https://bugzilla.mozilla.org/show_bug.cgi?id=1281158 The spec seems to be here: https://drafts.csswg.org/css-content-3/#alt
<rdar://problem/62585984>
It looks like we support [aria-expanded="test6"]::before { content: "\25BC"; alt: "test"; } but probably not this style .new::before { content: url(./img/star.png) / "New!"; /* or a localized attribute from the DOM: attr("data-alt") */ }
(In reply to chris fleizach from comment #2) > It looks like we support > > [aria-expanded="test6"]::before { > content: "\25BC"; > alt: "test"; > } > > but probably not this style > > .new::before { > content: url(./img/star.png) / "New!"; > /* or a localized attribute from the DOM: attr("data-alt") */ > } I tried > [aria-expanded="test6"]::before { > content: "\25BC"; > alt: "test"; > } and VO don't read the alt.
This appears to work for me. see the screen shot <style> .new::before { content: "\25BC"; alt: "test"; } </style> <div class="new">hello</div>
Created attachment 399136 [details] Picture
dupe of bug 159022 that includes test case *** This bug has been marked as a duplicate of bug 159022 ***