The CSS code in Divi can be added to different places, here is the list:
Theme Options
Page Settings
Advanced module settings
Code modules
Child theme
Inline style
Adding CSS in the Theme Options
The custom CSS box can be found at the bottom of the Theme Options under the "General" section. This box is synced with the Additional CSS box in the Theme Customizer.
Adding CSS on the Page Settings
The page settings can be found in the Divi Builder when you edit the page or a template.
Access the page settings by clicking on the purple circle in the Divi Builder to see the builder controls. Then, click on the settings icon and open the "Advanced" tab.
You can add CSS code specific to the page or template here.
Adding CSS on the Advanced module settings
Open the module settings > Advanced > Custom CSS. The code here should not have any CSS selectors, only CSS properties can be added, such as:
color: red;
This type of code should not be added here, but on the Theme Options panel:
.css-class {
color: red;
}
Adding CSS in Code modules
The CSS code can be added to the code module and it should be wrapped into the <style> </style> tag:
<style>
.css-class {
color: red;
}
</style>
Adding CSS in the Child theme
If you're using a child theme, you can add CSS code to the child theme's style.css file. Navigate to Appearance > Theme Editor, select the style.css file from the list of files on the right side, and add your CSS code at the bottom of the file.
Adding CSS as an Inline style
You can add CSS code as inline styles directly to HTML elements. This can be done in the text tab of the text editor or within a Code module.
When using inline styles, the CSS is applied directly to the specific HTML element using the style attribute.
style="color:red;"