I made a testing site, where you can see the problem: scella.net
With the Wave tool, I get the contrast error for the Skip Link, because I set the body background color to black. On the actual site, which I can’t have live yet, I have only 2 pages with this problem, and the other pages are not using transparent header, thus I have a white background color and therefore no error message.
How can I fix this just on 2 these two pages. I need to keep the black background color, otherwise I get a contrast error for the menu items.
Thank you for looking into this.
Technically, this is a false positive, since it’s a contrast error on an element that is not visible, and which changes color when it becomes visible.
The simplest solution for you would be to declare a background color & a color for the skip link while it’s hidden, e.g. #skiplinks a { background: #fff; color: #007; }
You’d need to declare both, because the default color your theme defines for links is also a contrast violation on a white background.
