Streaming live at 10am (PST)

Element Not Applying to Lower Breakpoints

Hi everyone, I’m wondering why a custom background image is not being reflected across lower breakpoints (tablet, mobile).

If you can see on my site’s link, you’ll notice that on the desktop/base breakpoint, there’s a slight pink-teal overlay on the hero section.

However, if you preview the tablet and mobile versions of the site. That overlay is nowhere to be seen.

Fact: that ‘overlay’ is a separate image that’s been added to the background. The settings are the same across all breakpoints, so I wanna know what’s causing this issue and how to resolve it.

Thanks.


Here is my site Read-Only: Webflow - AD3V1S

Published site URL: https://ad3v1s.webflow.io/

It would be helpful if you could share a published URL to the page, so inspection in a browser is possible.

Hi, go to tablet breakpoint and reset overwritten classes, you’ll see pink-teal overlay.

Okay! I updated my post with the published URL :slight_smile:

Oh, okay! Though I’m not sure what you meant by ‘overwritten classes’ since I didn’t override anything as far as I’m concerned. When I applied the pink-teal overlay on the base breakpoint, I assumed that it would automatically reflect on lower breakpoints.

Hi,

Though I’m not sure what you meant by ‘overwritten classes’ since I didn’t override anything as far as I’m concerned.

Sure you did: “Background Video” class has overriden position property. “Div Block” class - height property. These two make pink-teal overlay invisible.