Streaming live at 10am (PST)

[SOLVED] Trying to make a hero background image, video tutorial doesn't work


Hi there,
I'm trying to have a blurred background image on my hero section. This video seems to have exactly what I need, except following their directions exactly does not work.

The video instructs me to set the background image to have an absolute position, and set it to 100% of the container's width and height. However, when I set it to absolute, the image completely ignores the bounding box of the hero container and just fills up the whole screen, even expanding past the footer. How can I make the background image be bound to the dimensions of its container??

Here is my public share link:


Hi @winterdrake

Can you try setting position : relative to the parent element of your background image container ?



That was so easy, idk why I didn't try that in the first place. Thanks!


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