WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Dot Leaders Should Be Seen, but Not heard

for

From: Mark Harcourt
Date: Apr 14, 2021 9:59AM

Thank you, Daniel, for your suggestion. As I meant to suggest earlier, I am
(at best) an amateur at CSS. I tried several variations of your suggestion
to use CSS "border-bottom: dotted;" instead of the CSS "content"
using periods, but I could not figure out how to make it display. This is
more likely due to my inexperience than it is likely to be something
incompatible in the CSS file that I am seeking to modify.

Cheers.

Mark Harcourt

On Wed, Apr 14, 2021 at 11:29 AM Mark Harcourt < <EMAIL REMOVED> >
wrote:

> Thank you for your rapid reply. My inexperience led me to choose "role" as
> an attribute name. I am just seeking a convenient handle to use in the CSS
> selector that I coded for this: .dot-leader span[role="dot-leaders"]:after
>
> Please suggest a better attribute name that will not hijack the span
> element.
>
> Cheers.
>
> Mark Harcourt
>
> On Wed, Apr 14, 2021 at 11:24 AM JP Jamous < <EMAIL REMOVED> > wrote:
>
>> Mark,
>>
>> Why did you choose to use a role attribute on the span? role="dot-leaders"
>>
>> 1. This is not necessary and violates one of the 2 main principles of
>> ARIA. The role here serves no purpose, because you hid the span from
>> assistive technologies. Automated tools such as Axe or Wave, might call
>> that as a warning, because you are hijacking the span element.
>> 2. The role attribute has specific values that it uses. "dot-leaders" is
>> not one of them that I am aware of. If you are using this as a CSS class,
>> then you are implementing the role value incorrectly.
>>
>> Those are the only concerns I have noticed by reading quickly through
>> your markup.
>>
>>
>>
>>
>>
>> =================================================>> Jean-Pierre Jamous
>> Principal Digital Accessibility Engineer
>> Jepelsy LLC
>>
>> W: (952) 666-2930
>> M: (952) 666-2930
>> <EMAIL REMOVED>
>>
>> "The only limitations in life are those we set for ourselves"
>> =================================================>>
>>
>>