How can I create nesting lists in Webflow?

Webflow does not support nested lists (like <ul> inside another <li>) directly via the visual editor, but you can still achieve this effect using the Designer with some manual structure adjustments.

1. Use a Parent List Block

• Add a List element to your page (either Unordered List or Ordered List).
• Each list item (<li>) will become a List Item block inside the List.

2. Nest a New List Inside a List Item

• Select any List Item in your main list.
• Inside that List Item, drag a new List block (Unordered or Ordered) from the Add panel.
• This creates a nested list structure visually and in the actual HTML structure.

3. Style the Nested List Appropriately

• Webflow won’t apply automatic indentation for nested lists.
• Manually apply left margin or padding to the nested list if needed to create visual hierarchy.
• Use class names (e.g., .nested-list) to target and style nested lists consistently.

4. Repeat as Needed

• You can continue adding deeper levels by nesting more lists within nested List Items.
• Note: Going too deep can make structure hard to manage in Webflow's Navigator panel.

Summary

You can create nested lists in Webflow by manually placing a new List block inside a List Item. Style them with custom classes and spacing, as Webflow does not automatically style nested structures.