How to fix listitem on Webflow
Wrap every `<li>` element in a proper `<ul>` or `<ol>` parent so screen readers and browsers can correctly identify and announce list structure.
Steps for Webflow
- Open the Webflow Designer for your project.
- In the Navigator panel (left sidebar), find the `List Item` element that is not nested inside a `List` element.
- Select the orphaned List Item, then in the Navigator drag it inside an existing List element, OR add a new List element (Add Elements panel → List) and nest the List Item inside it.
- Alternatively, switch to the page's Embed element (if the `<li>` is in a custom HTML Embed block), click the </> icon to open the HTML editor, and add the `<ul>` wrapper manually.
- Publish the site and use the axe browser extension to confirm the fix.
<!-- ❌ WRONG: <li> with no list parent -->
<li>Free shipping over $50</li>
<li>30-day returns</li>
<!-- ✅ CORRECT: <li> items wrapped in <ul> -->
<ul>
<li>Free shipping over $50</li>
<li>30-day returns</li>
</ul>
<!-- ✅ CORRECT for navigation menus -->
<nav aria-label="Main">
<ul>
<li><a href="/shop">Shop</a></li>
<li><a href="/about">About</a></li>
</ul>
</nav>What is listitem?
In HTML, a list item (`<li>`) is only meaningful when it lives inside a list container — either an unordered list (`<ul>`) or an ordered list (`<ol>`). When a `<li>` tag appears on its own, without that parent wrapper, the HTML is technically invalid and breaks the expected structure. This often happens when a developer copies a navigation menu, product feature list, or footer links and accidentally removes the surrounding `<ul>` or `<ol>` tags, or when a theme or page-builder outputs `<li>` tags outside of a proper list container.
Screen readers used by blind and low-vision shoppers rely on correct list structure to announce items as "list of 5 items" and let users jump between them efficiently. An orphaned `<li>` breaks that experience — the screen reader may skip the item entirely or read it confusingly, making navigation menus, feature bullet points, and product lists unusable. This violates WCAG 2.1 Success Criterion 1.3.1 (Info and Relationships), which is a Level A requirement — the lowest acceptable bar — meaning failing it creates real legal risk under laws like the ADA (US), AODA (Canada), and EAA (EU). Beyond legal exposure, an inaccessible store loses business from the estimated 1-in-5 shoppers who have a disability, and invalid HTML can subtly harm how search engines parse and index your page content.
See the complete Listitem guide for every platform and the full background.
Not sure if your Webflow store has this?
Run a free SEOLZ audit — we’ll find listitem and every other issue across your whole site.
Scan my site free