How can I remove the default bullets and padding from a list in Webflow?

TL;DR
  • Select the list element in Webflow, go to the Style panel, set List Style to None to remove bullets, and adjust Padding and Margin to 0 to remove spacing.

Removing default bullets and padding from a list in Webflow is straightforward with a few style adjustments.

1. Select the List Element

  • Open your Webflow project and navigate to the page where your list is located.
  • Select the list element (either unordered or ordered) that you want to modify.

2. Adjust List Style Settings

  • Go to the Style panel on the right side of the Webflow Designer.
  • In the List settings section, set the List Style to None to remove bullets.

  

3. Remove Padding

  • Scroll down in the Style panel to the Spacing settings.
  • Set the Padding and Margin values (Top, Bottom, Left, and Right) to 0 to remove any spacing around the list.

4. Apply Custom Styles (Optional)

  • If you need specific styles, you can add custom Margin and Padding values as desired.
  • Use the Typography settings to style the list items further, like font size, color, etc.

Summary

By setting the List Style to None and adjusting the Padding and Margin to 0, you can effectively remove default bullets and spacing from your Webflow list. Customize further to fit your design needs.

Rate this answer

Other Webflow Questions