What components does this change affect?
This change affects all implementations of the checkbox group component.
HTML structure changes:
- Changed container element from <div> to <fieldset>
- Changed group label element from <label> to <legend>
Before
<div class="form-group">
<label class="control-label">Group Label</label>
<!-- checkboxes -->
</div>After
<fieldset class="form-group">
<legend class="control-label">Group Label</legend>
<!-- checkboxes -->
</fieldset>Why this change was made
This change improves the accessibility and semantic structure of the checkbox group component.
Benefits include:
- Better accessibility – screen readers can better identify and announce grouped checkboxes as a single related set
- Supports WCAG 2.2 guidance – improves semantic grouping and accessibility best practice
- Semantic HTML – uses elements according to their intended meaning rather than generic containers, improving structure and clarity
Recommended checks for consuming teams
After updating your Design System packages, we recommend reviewing checkbox groups in your application to confirm everything behaves as expected.
Areas worth checking:
- checkbox groups display correctly
- spacing and layout remain consistent
- validation messages display as expected
- screen reader behaviour meets your application requirements
Applications not using the NuGet package tag helpers should review any manually maintained checkbox group markup and align it with the updated structure shown above and on the checkbox group page in the form components section.
Data submission
No changes are expected to form submission, model binding, or data persistence as part of this update.
For peace of mind, you may wish to perform a quick check in consuming applications to confirm checkbox values continue to submit and save as expected.
Summary
This change is not expected to introduce functional issues. A quick review in consuming applications is recommended to confirm the updated markup works as expected in your implementation.
Internal reference
Design System internal reference: 95626