Re: CSS property for visually hiding an element

• From: Philip Taylor <p.taylor@rhul.ac.uk>
• Date: Mon, 3 Apr 2017 15:56:49 +0100
• To: Oliver Joseph Ash <oliverjash@gmail.com>, www-style@w3.org
• Message-ID: <3b99d87c-e36d-db80-fc1a-821df4a36e1c@rhul.ac.uk>

Oliver Joseph Ash wrote:
> It is quite common for web developers to require an element to be 
> hidden but only visually—that is, still accessible to screen readers 
> and keyboard users, but not visible on the screen.
>
> If you search for "visually hidden element CSS", you will find lots of 
> hacks to solve this problem. Most famously, perhaps, is the 
> "visuallyhidden" class that comes with the HTML5 boilerplate project: 
> https://github.com/h5bp/html5-boilerplate/blob/9d6176a26ca4b70ab64a51d7abb9d3ebaa197855/dist/css/main.css#L135
>
> Could we add something to CSS to support this requirement, so authors 
> don't have to resort to these crazy hacks?
>
> I fear many authors currently resort to using `display: none` instead, 
> which hides an element both visually and semantically. This is not 
> good for accessibility.
I am almost certainly missing something obvious, but what is the reason 
that "visibility: hidden" does not suffice ?
Philip Taylor

Received on Monday, 3 April 2017 14:57:25 UTC