a11y - CSS - Visually hidden, screen reader accessible text

sr-only.css

/*
 * SOURCE:
 * Much respect to Chris Coyier of CSS-Tricks
 * https://css-tricks.com/places-its-tempting-to-use-display-none-but-dont/
 *
 * TESTED:
 * OSX VoiceOver
 * Windows 7 NVDA
 * 
 * USE CASES:
 * Sass or PostCSS mixin
 * Standalone CSS class
 */

.sr-only { 
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}