BillyRayPreachersSon
Programmer
Hi,
I'm trying to find the best way of hiding text from regular browsers with rich CSS support, while keeping the text 'visible' so that it is read by screen readers.
I've read several articles which seem to indicate that "display:none" has different results on different screen readers (some reading the text, some not). To that end, I started using the following CSS:
which seems to have the desired effect in all browsers I've tried. Without wanting to download and install every screen reader available to test this out, can anyone think of any drawbacks to this method, or other methods that might prove just as (or more) effective?
Thanks!
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
I'm trying to find the best way of hiding text from regular browsers with rich CSS support, while keeping the text 'visible' so that it is read by screen readers.
I've read several articles which seem to indicate that "display:none" has different results on different screen readers (some reading the text, some not). To that end, I started using the following CSS:
Code:
.invisible {
position: absolute;
width: 0px;
height: 0px;
overflow: hidden;
}
which seems to have the desired effect in all browsers I've tried. Without wanting to download and install every screen reader available to test this out, can anyone think of any drawbacks to this method, or other methods that might prove just as (or more) effective?
Thanks!
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]