cristinafsanz
10/25/2019 - 7:58 AM

Visually hidden (accessibility)

https://aerolab.co/blog/web-accessibility

If you want to hide elements from view but still let screen readers know about them.

.visually-hidden { 
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
body:hover .visually-hidden a, body:hover .visually-hidden input, body:hover .visually-hidden button { display: none !important; }