focus ring

​​This would solve many problems. Alas, only supported in IE11

outline-color: invert;

The invert keyword *inverts* whatever color is applied to the background.
This ensures enough contrast and hence visibility of the outline regardless
of background color.

More specifically, this keyword value causes the browser to invert the
pixels on the screen where the outline will go, to ensure maximum
visibility and focus on the element.

Browsers may ignore the invert value on platforms that do not support color
inversion of the pixels on the screen. If the browser does not support the
invert value then the initial value of the outline-color property is the
value of the color <http://tympanus.net/codrops/css_reference/color>
property.


-- 
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315    fax: 512.206.9452 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964

Received on Wednesday, 21 February 2018 22:11:30 UTC