Last Comment Bug 759705 - No Accessible name for control when label has position:absolute and overflow:hidden
: No Accessible name for control when label has position:absolute and overflow:...
Status: RESOLVED DUPLICATE of bug 501580
: access
Product: Core
Classification: Components
Component: Disability Access APIs (show other bugs)
: Trunk
: x86 Windows 7
-- normal with 1 vote (vote)
: ---
Assigned To: Nobody; OK to take it and work on it
:
: alexander :surkov
Mentors:
Depends on:
Blocks: namea11y
  Show dependency treegraph
 
Reported: 2012-05-30 04:00 PDT by Hans Hillen
Modified: 2017-04-27 02:03 PDT (History)
4 users (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---


Attachments
hiddenlabelbug.html (455 bytes, text/html)
2012-05-30 04:00 PDT, Hans Hillen
no flags Details

Description User image Hans Hillen 2012-05-30 04:00:56 PDT
Created attachment 628303 [details]
hiddenlabelbug.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.52 Safari/536.5

Steps to reproduce:

When a form control's label is hidden off screen, Firefox exposes Null as accessible name for the control. This seems to be occur whenever the label is styled with position:absolute; and overflow:hidden; (even if the label itself is still visible on the screen). If either the position or overflow CSS property is removed, the problem no longer occurs. Only when both position:absolute and overflow:hidden are set.

The attached test case demonstrates this issue (HTML code shown below).

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>Test Case for label bug </title>
	<style type="text/css">
		.element-invisible {
			overflow: hidden;
			position: absolute;
			/*left: -999em;
			width: 1em;
			*/
		}
	</style>
</head>

<body>	
	<h1>Test case for label issue</h1>
	<label class="element-invisible" for="sampleTxt1">A hidden label</label>
	<br /><br />
	<input type="text" id="sampleTxt1" />
</body>
</html>		



Expected results:

The label's styles should have no effect on the accessible name of the associated form control (especially since position and overflow are often used to hide content off screen).
Comment 1 User image Hans Hillen 2012-05-30 04:24:22 PDT
It seems that the label is no longer considered an accessible object once the position and overflow style are set.
Comment 2 User image Marco Zehe (:MarcoZ) 2013-11-07 00:23:21 PST
This is blocking web developers from using sanctioned techniques to apply more context information for screen reader users. Read here:
http://juicystudio.com/article/hidden-label-firefox-bug.php
Alex, can you take a look please?
Comment 3 User image alexander :surkov 2013-11-07 07:03:02 PST

*** This bug has been marked as a duplicate of bug 501580 ***
Comment 4 User image Adam 2017-04-27 02:03:31 PDT Comment hidden (spam)

Note You need to log in before you can comment on or make changes to this bug.