Accessible hiding content with CSS

Using display:none can also hide content from screen readers. If you do this, best use visibility:hidden as well, to ensure consistent behaviour in all readers.


To hide from visual display but not screen readers, move the element off screen:

.hide {
  position: absolute;
  left: -999em;
  width: 0;
  overflow: hidden;

Last modified: 14/05/2010 Tags: ,

This website is a personal resource. Nothing here is guaranteed correct or complete, so use at your own risk and try not to delete the Internet. -Stephan

Site Info

Privacy policy

Go to top