Streaming live at 10am (PST)

How to get my heading in front of the gradient background of the section


I have the following layout - where I have a gradient background on the section. I can't understand why the gradient is going OVER the 'Schedule' and not the 'Class' ? I do not want it to go over the 'schedule'.

Here's the link to my site:


Hi @Sandy, thanks for your post smile I was taking a look at this, but it looks like you have a section with the background set to a linear gradient, then a div block containing your h2 elements that are sitting on top of that. Those appear to be working normally to me.

Here is a quick video:

Could you clarify what mean by "the gradient is going OVER the 'Schedule' and not the 'Class'" ? Do you not want any linear background on the h2 elements? Cheers, Dave


@Sandy, do you mean that the linear gradient seems to appear "over" the "SCHEDULE" but not the "CLASS"? If so, I think the answer is that the gradient is still UNDER both, but CLASS is opaque, while SCHEDULE has a transparency. That is, your rgba(0,0,0,0.2) means it's not gray, it's black that is mostly transparent. So the gradient is showing through the mostly transparent black.


Ah! Indeed that was it - the transparency of the heading was impacted by the gradient. Obvious now. blush

Thanks so much!!


This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.