[list] <ul> and <ol> must only directly contain <li>, <script> or <template> elements #869
Description
Title
[list] <ul> and <ol> must only directly contain <li>, <script> or <template> elements
Description
The page contains an unordered list (<ul class="content-grid-simple">) that includes direct children which are not <li>, <script>, or <template> elements. This violates the HTML specification and can lead to inconsistent rendering across browsers as well as difficulties for assistive technologies to interpret the list structure correctly.
Steps to Reproduce
- Go to /reference/p5/arc/
- Locate to the following element:
#main-content > div.md:mx-lg.mt-md.mx-5 > div:nth-child(2) > section > ul
(This issue is since to be a global issue)
Actual Behavior
The <ul> element contains elements other than <li>, <script>, or <template> as direct children.
The <ul> element includes disallowed direct children (e.g., <div>, <p>, etc.) rather than wrapping all content within <li>, <script>, or <template> elements.
Expected Behavior
Ensure all ordered (<ol>) and unordered (<ul>) list elements only have the following elements as direct children:
<li><script><template>
Any other elements should be wrapped appropriately within<li>elements.
Environments
No response
Suggested Fix
Refactor the markup so that all direct children of <ul> or <ol> that are not <li>, <script>, <template> elements are wrapped within <li> elements. For example:
<ul class="content-grid-simple">
<li><div>Content</div></li>
</ul>Reference
WCAG:
WCAG-T:
- H48: Using ol, ul and dl for lists or groups of links
- F43: Failure of Success Criterion 1.3.1 due to using structural markup in a way that does not represent relationships in the content
other:
What is your operating system?
None
Web browser and version
No response