This tutorial with help you adjust the spacing above and below the Ordered (ol li) and Unordered (ul li) lists used inside the content body of a module using CSS.
How to adjust the spacings on a specific module.
Define a CSS Class to the Text module
You can go to the Module settings > Advanced > CSS Class, define a unique class name: divi_list_spacing
First, we will remove the default spacing above the Ordered List and Unordered lists by adding this CSS in Theme Options > Custom CSS:
.divi_list_spacing *:has(+ ol), .divi_list_spacing *:has(+ ul) {
padding-bottom: 0;
}
As a result, the spacing above the Ordered list and Unordered list will be zero.Now add this CSS code just below the previous CSS code in Theme Options > Custom CSS:
.divi_list_spacing ol:first-child, .divi_list_spacing ul:first-child {
padding-bottom: 10px;
}
.divi_list_spacing * + ol, .divi_list_spacing * + ul {
padding-top: 10px;
padding-bottom: 10px;
}
This part is where you can adjust the spacing for above and below the Ordered and Unordered list as you want. Modify the padding-top: 10px and padding-bottom: 10px which suits best for you.
How to adjust Ordered and Unordered listing spacings for all Text modules
If you want to apply the above CSS for all Text modules, you can skip the custom CSS Class name part and use this CSS in WordPress Dashboard > Divi > Theme Options > Custom CSS:
.et_pb_text_inner *:has(+ ol), .et_pb_text_inner *:has(+ ul) {
padding-bottom: 0;
}
.et_pb_text_inner ol:first-child, .et_pb_text_inner ul:first-child {
padding-bottom: 10px;
}
.et_pb_text_inner * + ol, .et_pb_text_inner * + ul {
padding-top: 10px;
padding-bottom: 10px;
}
The above code will apply to all text modules at once.