MonorailCss

Screen Reader

Utilities for controlling the visibility of content to screen readers.

Class CSS Output
sr-only 
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border-width: 0;
}
not-sr-only 
position: static;
width: auto;
height: auto;
padding: 0;
margin: 0;
overflow: visible;
clip-path: none;
white-space: normal;
}

sr-only

position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border-width: 0;

not-sr-only

position: static;
width: auto;
height: auto;
padding: 0;
margin: 0;
overflow: visible;
clip-path: none;
white-space: normal;

Reference

border-width MDN ↗
clip-path MDN ↗
height MDN ↗
margin MDN ↗
overflow MDN ↗
padding MDN ↗
position MDN ↗
white-space MDN ↗
width MDN ↗

CSS Properties

  • border-width
  • clip-path
  • height
  • margin
  • overflow
  • padding
  • position
  • white-space
  • width