Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Too strong selectors

See original GitHub issue

The following selector Is a notch too strong (0, 2, 1) and overrides normal class names:

https://github.com/twbs/bootstrap/blob/6dd3d91768227a7ac03a63f8e47eacae99be8892/scss/_reboot.scss#L208-L220

It could be

a[name]:not([href]):not([tabindex]): {
  color: inherit;
  text-decoration: none;


  @include hover-focus {
    color: inherit;
    text-decoration: none;
  }


  &:focus {
    outline: 0;
  }
}

Note: Updated snippet to better reflect the purpose of the styling i.e. named anchors. Original selector was a:not([href]):not([tabindex]):not([class])

Issue Analytics

State:
Created 6 years ago
Comments:19 (13 by maintainers)

Top GitHub Comments

14reactions

imoarkcommented, Aug 1, 2019

Same issue as @bmaehr Can confirm that a:not([href]):not([tabindex]) is basically too strong, that it overrides a class selector. Any good workaround??

2reactions

willimaesecommented, Jun 11, 2019

I have the same issue as @bmaehr . “a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover” selector is too strong and overrides our app styles.