Divi Theme Customization With CSS – Learn CSS With The Divi Theme 3.0

by | Mar 10, 2020 | 0 comments

Divi Theme Customization With CSS – Learn CSS With The Divi Theme 3.0

by | Mar 10, 2020 | CSS Tips and Tricks | 0 comments



You can watch the entire divi theme tutorial i created here: https://www.youtube.com/watch?v=UvX3_vlFf5w&t=318s
In this divi theme tutorial, ill show you how to add some custom CSS to create some really nice and unique designs! The CSS for this divi theme tutorial are located below! You can also preview the demo website at https://www.wpdarrel.com

NOTICE: MAKE SURE THERE ARE NO SPACES WHATSOEVER OR THE CSS WILL NOT WORK, MAKE IT EXACTLY LIKE THE VIDEO

For The First Section, Add this in the TEAL BOX SETTINGS In The “COLUMN 1 BEFORE”
content: ”;
position: absolute;
top: -50px;
left: -150px;
right: -110px;
bottom: 0;
transform: skew(-16deg);
background: #fff;
box-shadow: 1px 1px 28px 0px #33333342;

THAN

Add this CSS in the “COLUMN 1 MAIN ELEMENT”
z-index:99;

This CUSTOM CSS FOR THE CONTACT SECTION:

Enter this CSS in the COLUMN 2 BEFORE Section:
content:”;
content: ”;
position: absolute;
top: 0;
left: 0;
right: -62px;
bottom: 0;
background-image: linear-gradient(148deg,#340996 11%,#4de7df 100%);
transform: skewX(-10deg);
box-shadow: 1px 1px 47px 0px rgba(51, 51, 51, 0.4);

ALSO, Add this CSS In The MAIN ELEMENT For The TEXT MODULE: margin-left: auto !important;

Also if you wanted to learn how to make a wordpress website, you should visit my latest divi theme tutorial! https://www.youtube.com/watch?v=UvX3_vlFf5w&t=318s

The Divi theme 3.0 was created by elegant themes, a really reliable wordpress company. For more tutorials like this or to learn how to make a wordpress website, feel free to visit my website at https://www.darrelwilson.com

You can visit the designers of this layout at https://www.bestdivichild.com

source