How can I edit specific classes that I have created in Webflow? I am unable to locate the option box mentioned in an old response from 2014, and I do not see it to the right of the classes text field. The only dropdowns I see are for renaming or duplicating a class and selecting pseudo-classes. Here are screenshots for reference: [Include screenshots here]
TL;DR
- Select an element with the desired class or manually apply the class via the selector field to edit styles.
- Use the class selector dropdown to rename, duplicate, or add combo/pseudo-classes, and manage unused classes via the Style Manager.
To edit specific classes in Webflow, you no longer use the same UI as described in older versions like in 2014. Webflow has updated how you manage class styles. Here's how to access and edit your classes using the current interface:
1. Select the Element With the Class
- Click on the element on the canvas that already has the class you want to edit.
- In the Style panel (on the right sidebar), the class name will appear in the selector field at the top.
2. Edit the Class’s Styles
- Once the class is selected, any style changes you make (e.g., margin, color, typography) will apply to that class.
- This allows you to globally update all elements using that class.
3. Access and Switch to Other Classes
- Click the dropdown arrow to the right of the class name at the top of the Style panel.
- This gives you options to:
- Rename or Duplicate the class.
- Apply Combo Classes.
- Add pseudo-classes (like
:hover).
4. Use the Selector Search to Edit Unused Classes
- If the class isn’t on the current element:
- Go to any element on the canvas.
- In the class field, start typing the name of the class.
- Select it from the auto-suggested list. If it's a global class, selecting it will let you edit it as if it were already applied.
- You can modify its styles directly after it’s selected.
5. Clean Up or Manage Classes
- To delete unused classes, open the Style Manager (stacked icon in the right panel).
- Click Clean Up to remove unused classes.
- You can also search the Style Manager to find and select a specific class.
Summary
To edit a class in Webflow, select an element using that class or manually apply the class via the selector field. The option box for class management has evolved—now you use the class selector dropdown to rename/duplicate or apply combo/pseudo-classes. Use the Style Manager to manage unused styles.