2. Working with focus styles

WebAIM checklist items:

• 2.4.7: http://webaim.org/standards/wcag/checklist#sc2.4.7

:focuspseudo-class

outlineCSS property

:hoverpseudo-class

::beforepseudo-element

4. Input Modality

https://youtu.be/bfPGicTGBTI

:moz-focusringpseudo-class

Proposing CSS input modality article

Input modality shim

5. Styling with Aria

https://youtu.be/K9u9udvm8ng

CSS attribute selectors

Author's note:

Just noticed in this example that we left offtabindex="0"(hopefully you caught that as well)! When you're building custom controls be sure to includetabindexso keyboard users can easily interact with the elements.