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 :slight_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.

1 Like

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.