Skip to main content
All CollectionsTroubleshooting and FAQsFrequently Asked QuestionsGeneral
How to Add Additional CSS Classes to Divi Elements
How to Add Additional CSS Classes to Divi Elements

Learn how to add additional CSS classes to Divi elements for enhanced customization and precise styling of your website.

Updated over a week ago

Customizing your Divi website often requires adding CSS classes to specific elements to achieve your desired design and functionality.

In this article, we will guide you through the process of adding additional CSS classes to Divi elements.

Whether you want to apply custom styles, trigger specific JavaScript functions, or enhance your site's interactivity, our step-by-step instructions will show you how to assign CSS classes to any module, row, or section within Divi.

Add Custom CSS classes to a Section

  1. Open the section's settings by clicking on the Gear icon

  2. Go to Advanced Tab → CSS ID & Classes → CSS Class

  3. Type in the class name you want to use

    Divi - Add custom CSS class to a Section

Add Custom CSS classes to a Row

  1. Open the Row's settings by clicking on the Gear icon

  2. Go to Advanced Tab → CSS ID & Classes → CSS Class

  3. Type in the class name you want to use

    Divi - Add custom CSS class to a Row

Add Custom CSS classes to a Column

  1. Open the Rows's settings that contain the column to which you want to add a Custom CSS class by clicking on the Gear icon

  2. Go to Advanced Tab → CSS ID & Classes → CSS Class

  3. Type in the class name you want to use

    Divi - Add custom CSS class to a Column

Add custom CSS classes to a Module

  1. Open the Module's settings by clicking on the Gear icon

  2. Go to Advanced Tab → CSS ID & Classes → CSS Class

  3. Type in the class name you want to use

    Divi - Add custom CSS class to a Module

Note: You can add multiple CSS classes by separating them with a space.

Did this answer your question?