Site logo

Archived topic

Diagonal block of colour for background

5 replies · Started by Martin on January 4, 2019

Viewing posts 1–6 of 6

Hi there,

are you using a pagebuilder or something else to create your rows?

Hi David

Happy new year to you!
Thanks for looking at this for me, I have been using 'SiteOrigin Page Builder', but happy to move to another option.

Many thanks
Martin

That Divi built page is using background images for each of the sections. Which is not a nice way to do it. Simplest way i reckon, add this CSS:

.bottom-divider {
    background: linear-gradient(175deg, rgba(255,255,255,0) 80%, rgba(244,225,4,1) 80%);
}
.top-divider {
    background: linear-gradient(355deg, rgba(255,255,255,0) 80%, rgba(244,225,4,1) 80%);    
}

Now you have three sections:
Section 1 has the bottom-divider class
Section 2 has a solid color background to match divider colors
Section 3 has the top-divider class

Hi David
Thanks for the advice, but can you give me some more details about how I use this please?
Many thanks
Martin

So add the CSS to your Additional CSS in Customizer.
I think if you edit a Row in siteorigin there is an attributes tab and their should be a Row Class field. Add one of the CSS Classes from above to that.

This archived topic is closed to new replies.