When your website means business.

Accessibility, CSS | Type: CSSAccessible Hiding of Elements with CSS

Developers commonly use display: none to hide content on the page. Unfortunately, this simple and common action can be problematic for users of screen readers. Below is a better way:

.visually-hidden { /* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility */
    position: absolute !important;
    height: 1px; width: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
}

Reference Links

We use cookies in order to give you the best possible experience on our website. By continuing to use this site, you agree to our use of cookies.
Accept