liser
Version:
functional css help to optimizing design work and building responsive websites
19 lines (17 loc) • 1.1 kB
CSS
/*
Text that is hidden but accessible
Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.clip { position: fixed ; _position: absolute ; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
@media screen and (min-width: 30em) {
.clip-ns { position: fixed ; position: absolute ; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
}
@media screen and (min-width: 30em) and (max-width: 60em) {
.clip-m { position: fixed ; position: absolute ; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
}
@media screen and (max-width: 60em) and (orientation: landscape) {
.clip-ml { position: fixed ; position: absolute ; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
}
@media screen and (min-width: 60em) {
.clip-l { position: fixed ; position: absolute ; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
}