Skip to content

Stacking order bug causes color-contrast to misidentify background #4540

Open
@WilcoFiers

Description

@WilcoFiers

The following should pass:

<style>
  #container {
    position: fixed;
    background-color: #333;
    padding: 0.5em 2em;
  }
  #target {
    filter: contrast(100%);
    color: #eee;
  }
</style>
<div id="container">
  <span id="target"> Hello world </span>
</div>

There's some bug in createGrid() which results in the stacking order of #target to be calculated incorrectly. This comes from the filter property. Removing that avoids the issue. This is going to require a very close read of the CSS spec to figure out.

Metadata

Metadata

Assignees

No one assigned

    Labels

    color contrastColor contrast issuesfixBug fixesrulesIssue or false result from an axe-core rulesupport

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions