diff options
| author | Scott O'Hara <[email protected]> | 2021-11-09 00:54:42 -0500 |
|---|---|---|
| committer | GitHub <[email protected]> | 2021-11-09 07:54:42 +0200 |
| commit | e958cd26371a19df613efce52ecf42c4b0adcddd (patch) | |
| tree | 9b711d8c6d45732618f0a51d803205da84eceefe | |
| parent | 31998dfd1e972faf46ab23c26533d3e1a5f5e4bf (diff) | |
| download | bootstrap-e958cd26371a19df613efce52ecf42c4b0adcddd.tar.xz bootstrap-e958cd26371a19df613efce52ecf42c4b0adcddd.zip | |
floating-labels: remove aria-label in the select example (#35327)
While it is understood that this is just an example, the visible text (label) of "Works with selects" and the `aria-label="Floating label select example"` created a [WCAG 2.5.3 Label in name](https://www.w3.org/WAI/WCAG21/quickref/#label-in-name) failure.
As the `aria-label` isn't necessary here since this `select` is already provided an accessible name by its `label` element, removing the unnecessary `aria-label` seems the best course of action as:
* removing it solves the WCAG issue
* it removes the potential implication to developers that they'd even _need_ an `aria-label` here, let alone indirectly suggesting that it's ok for the visible text and accessible name to be out of alignment
| -rw-r--r-- | site/content/docs/5.1/forms/floating-labels.md | 2 |
1 files changed, 1 insertions, 1 deletions
diff --git a/site/content/docs/5.1/forms/floating-labels.md b/site/content/docs/5.1/forms/floating-labels.md index 941055089..2ac675204 100644 --- a/site/content/docs/5.1/forms/floating-labels.md +++ b/site/content/docs/5.1/forms/floating-labels.md @@ -89,7 +89,7 @@ When working with the Bootstrap grid system, be sure to place form elements with </div> <div class="col-md"> <div class="form-floating"> - <select class="form-select" id="floatingSelectGrid" aria-label="Floating label select example"> + <select class="form-select" id="floatingSelectGrid"> <option selected>Open this select menu</option> <option value="1">One</option> <option value="2">Two</option> |