ciser
Version:
Functional CSS, help quickly build and design new UI without writing css.
29 lines (24 loc) • 1.23 kB
CSS
/*
VISIBILITY
Media Query Extensions:
-ns = not-small
-m = medium -ml = mobile landscape
-l = large
*/
/*
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 ); }
}