How to show a label only to Screen Readers - Web Accessiblity

accessibility, html, screen-readers

Solution

The best way I have found is to make a class you can toggle that will use CSS to hide text visually. The code I've used is:

    .hidden
{position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;}

As for hiding text only from screen readers, what sort of situation would be requiring that?

Problem

In HTML, I want to show a `<label>` placed with my textbox to show only for screen readers or voice browsers. what are the ways to achieve that with respect to WAG-ARIA guidelines and I would also like to know the vice versa scenario of hiding some text only from voice browsers ?

Original source

Related problems