Highlight the currently active navigation item
Want to style the current active navigation item?
Use
[aria-current="page"] { // your styles }
instead of setting an active className, so screen reader users will also recognize this as the current active page.
More info: https://t.co/OJxjnU9uqa
— Michael Scharnagl (@justmarkup) March 24, 2020
The mentioned article lists a whole bunch more values that can be used as aria-current
, like step
or date
.
[aria-current="page"] {
// your styles
}