There are a number of possible causes why your custom CSS may not be applied.
First let's see where we can add Custom CSS:
A. Divi Theme Options > Custom CSS area:
B. Page Settings > Advanced Tab > Custom CSS
C. Module > Advanced Tab > Custom CSS
There is a big difference between the Custom CSS in areas (A, B) and the Custom CSS in areas (C).
In the first two areas (A and B) full CSS code must be written, meaning we need to include the CSS selector (CSS class or CSS id) as well as all the CSS properties that we want to apply to a certain element.
Whereas in area C we only need to add the CSS properties. for example if we are working with a Text Module and we want to apply a
background-color using the Custom CSS, we need to use the Main Element section and only add the CSS property:
The CSS selector will be built by Divi so we don't have to worry about it.
Why the custom CSS code is not getting applied
1. Syntax Errors
Reason: CSS code has syntax errors
Fix: Make sure that you write clean and valid CSS code. A good tool for checking your CSS code for errors, amount the build in Syntax Checker is www.csslint.net
2. Cache issue
Reason: your server will used a cached version of CSS
Fix: clear the browser and server cache
Extra tip: During the development of your website, its best to not use any type of cache system (server side or plugin side). Once everything works and looks the way you wanted, feel free to add at most 1 cache plugin.
3. CSS selector used doesn't exist
Reason: You might have deleted a custom CSS class and or CSS ID set for an element to which you want to apply the CSS Code.
Fix: Double check your CSS Code to ensure your CSS Selector exists on the page.