HTML and CSS Reference
In-Depth Information
<a class="visuallyhidden" href="#main">Skip
Navigation</a>
This makes the link disappear from our screen, but is it available to screen readers.
The web page displayed in the following screenshot does not show the Skip Navig-
ation link:
The CSS rule that makes this happen is as follows:
.visuallyhidden {
border: 0;
clip: rect(0 000);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
A typical solution used to involve having them positioned absolutely with a height
of 0px , but this would prevent Apple's VoiceOver screen reader from reading the
content.
Search WWH ::




Custom Search