10BC0 GitHub Β· Where software is built
[go: up one dir, main page]

Skip to content

[css-selectors-4] browser focus styles and focus-visible, example 38Β #4278

@frivoal

Description

@frivoal

My understanding of :focus-visible was that it gave authors access to the existing logic by which browsers style focused elements, so that authors could change that, without adding focus indicators onto things where the browser wouldn't, which is what would happen if they used :focus instead.

However, the spec, and in particular example 38, suggest that authors could write something like:

:focus:not(:focus-visible) {
  outline: 0;
}

in order to suppress browser-supplied focus indicators on elements that match :focus but not :focus-visible.

That's very confusing to me, as by my understanding, there should be no such element. The sentence immediately before the example also seems to agree with me.

Maybe that selector is meant as a poor man's @support for selectors, but it's given what the rest of the example does, it's not needed or useful.

If I'm right, this example is causing confusion and inducing authors to think that they need to use :focus:not(:focus-visible) to select and suppress undesirable browser styles, which is just not true. In that case, this should be removed from the example.

If I'm wrong, I'd like to understand why, because then the feature no longer makes sense to me.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      0