WAI-ARIA: aria-setsize (Property)
Description
Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM. See related aria-posinset.
This property is marked on the members of a set, not the container element that collects the members of the set. To orient the user by saying an element is “item X out of Y,” the assistive technologies would use X equal to the aria-posinset attribute and Y equal to the aria-setsize attribute.
If all items in a set are present in the document structure, it is not necessary to set this property, as the user agent can automatically calculate the set size and position for each item. However, if only a portion of the set is present in the document structure at a given moment (in order to reduce document size), this property is needed to provide an explicit indication of set size.
Authors MUST set the value of aria-setsize to an integer equal to the number of items in the set. If the total number of items is unknown, authors SHOULD set the value of aria-setsize to -1.
When exposing aria-setsize on a menuitem, menuitemcheckbox, or menuitemradio, authors SHOULD set the value of aria-setsize based on the total number of items in the menu, excluding any separators.
Browser Compatibility
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
ariaSetSize | ChromeFull support84 | EdgeFull support84 | FirefoxNo supportNo | Internet ExplorerNo supportNo | OperaFull support70 | SafariFull support12.1 | WebView AndroidFull support84 | Chrome AndroidFull support84 | Firefox for AndroidNo supportNo | Opera AndroidFull support60 | Safari on iOSFull support12.2 | Samsung InternetFull support14.0 |
aria-setsize Example
HTML Example
The following example shows items 5 through 8 in a set of 16.
<h2 id="label_fruit">Available Fruit</h2>
<ul role="listbox" aria-labelledby="label_fruit">
<li role="option" aria-setsize="16" aria-posinset="5">apples</li>
<li role="option" aria-setsize="16" aria-posinset="6">bananas</li>
<li role="option" aria-setsize="16" aria-posinset="7">cantaloupes</li>
<li role="option" aria-setsize="16" aria-posinset="8">dates</li>
</ul>HTML Example 2
The following example shows items 5 through 8 in a set whose total size is unknown.
<h2 id="label_fruit">Available Fruit</h2>
<ul role="listbox" aria-labelledby="label_fruit">
<li role="option" aria-setsize="-1" aria-posinset="5">apples</li>
<li role="option" aria-setsize="-1" aria-posinset="6">bananas</li>
<li role="option" aria-setsize="-1" aria-posinset="7">cantaloupes</li>
<li role="option" aria-setsize="-1" aria-posinset="8">dates</li>
</ul>Characteristics
Used in Roles
Inherits into Roles
Value
- integer
- A numerical value without a fractional component.
Semantic HTML
No HTML element equivalent.
Reference
- WAI-ARIA 1.2 Specification
Refer to the notes from the WAI-ARIA 1.2 specification for more information on aria-setsize. - MDN Web Docs
The browser compatibility for each of the ARIA attributes is taken from the MDN Web Docs. Please refer to the original source if browser compatibility is updated for aria-setsize.
Explore more on DigitalA11Y Insights
Similar Posts
WAI-ARIA: aria-errormessage (Property)
Description New in ARIA 1.1 Identifies the element that provides an error message for the object. See related aria-invalid and aria-describedby. The aria-errormessage attribute references another element that contains custom error message text. Authors MUST use aria-invalid in conjunction with aria-errormessage. Initially, the object is in a valid state and either has an aria-invalid set…
WAI-ARIA: aria-atomic (Property)
Description Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. Both accessibility APIs and the Document Object Model [dom] provide events to allow the assistive technologies to determine changed areas of the document. When the content of a live region…
WAI-ARIA: aria-required (Property)
Description Indicates that user input is required on the element before a form may be submitted. For example, if the user needs to fill in an address field, the author will need to set the field’s aria-required attribute to true. Note: The fact that the element is required is often presented visually (such as a sign…
WAI-ARIA: aria-placeholder (Property)
Description New in ARIA 1.1 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format. Authors SHOULD NOT use aria-placeholder instead of a label as their purposes…
WAI-ARIA: aria-level (Property)
Description Defines the hierarchical level of an element within a structure. This can be applied inside trees to tree items, to headings inside a document, to nested grids, nested tablists and to other structural items that may appear inside a container or participate in an ownership hierarchy. The value for aria-level is an integer greater…
WAI-ARIA: aria-roledescription (Property)
Description New in ARIA 1.1 Defines a human-readable, author-localized description for the role of an element. Some assistive technologies, such as screen readers, present the role of an element as part of the user experience. Such assistive technologies typically localize the name of the role, and they may customize it as well. Users of these…
