Make WordPress Core

Opened 13 years ago

Closed 11 years ago

#16527 closed enhancement (duplicate)

Accessibility Improvement to category-template.php

Reported by: wpsmith's profile wpsmith Owned by: wpsmith's profile wpsmith
Milestone: Priority: normal
Severity: normal Version: 3.0
Component: Accessibility Keywords:
Focuses: Cc:


When I was testing my site (, running WordPress 3.1 RC4) for accessibility at, I noticed that the categories widget was not displaying a <label> tag. So upon investigation, I discovered that category-template.php wasn't issuing a <label> tag on line 334 in the function wp_dropdown_categories(). So I propose the following edit.

$output = "<label for='$id' style='display:none;'>$name</label><select name='$name' id='$id' class='$class' $tab_index_attribute>\n"; //added <label for='$id' style='display:none;'>$name</label>

Once I made this change, my site passed web accessibility.

Attachments (1)

16527.patch (587 bytes) - added by SergeyBiryukov 13 years ago.

Download all attachments as: .zip

Change History (10)

#1 @wpsmith
13 years ago

  • Keywords has-patch added

#2 @nacin
13 years ago

  • Type changed from defect (bug) to enhancement
  • Version changed from 3.1 to 3.0

We would use something like screen-reader-text, probably.

#3 @Elpie
13 years ago

  • Cc Elpie added

#4 @dd32
13 years ago

  • Component changed from General to Template

#6 @karlgroves
12 years ago

The use of display:none style declaration would effectively hide that label from everyone, including users of assistive technologies. Such a declaration should only be used in cases where you absolutely want to hide something from every single visitor.

To provide "hidden" content for users of assistive technologies, position the content offscreen.

#7 @dd32
12 years ago

To provide "hidden" content for users of assistive technologies, position the content offscreen.

For the record, that's what Nacin was referring to above. The class 'screen-reader-text' positions the element off screen so that it's still readable by screen readers.

/* Hide visually but not from screen readers */
.screen-reader-text span {
	position: absolute;
	left: -1000em;
	height: 1px;
	width: 1px;
	overflow: hidden;

#8 @SergeyBiryukov
11 years ago

  • Component changed from Template to Accessibility
  • Keywords has-patch removed

#9 @SergeyBiryukov
11 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to duplicate
  • Status changed from new to closed

Duplicate of #18650.

Note: See TracTickets for help on using tickets.