Accessible Menus or Closed Items Using the Input Checkbox Method
Published May 21, 2018 | Categories: Web Development
When using the checkbox method to open and close an element, you don’t want to hide the input box. Doing that will make it non-accessible. Instead use this method for visual reference, but still allowing a keyboard to access the input checkbox.
Input Checkbox CSS:
input#IDname { position: absolute; display: inline; height: 0; width: 0; margin: 0; padding: 0; border: none; opacity: 0; }
Note: Make the action item the end user sees with an outline to indicate that they have something to access.
Recent Posts
Hello from Beaconville: High Ed Conference Wrap-Up
View this Story
Cue the Confetti: Celebrating 2022's Higher Ed Wins So Far
View this Story
Beacon Technologies Opens Second Location in Carolina Beach, NC
View this Story
Why You Need Audience Personas For Your Website Content
View this Story