Streaming live at 10am (PST)

Hero Section Not Displaying

Hello everyone, new to the Webflow Forum, I have the basics of HTML and CSS

I’ve practising using Webflow to build a website but I’m having a problem trying to get the “Section Header” to display the way I want it to in the browser. The Section Header has a background image with a bottom padding of 253px but in the browser, the background image keeps cutting off!!!


Hi @webflowmac

Please post a readonly link to your website so that we can see what is the issue there! But in all likelyhood the issue lies with the background settings of the div - have a look at those options:

Hello @webflowmac,

What is the height of your section 1 header?

OOps, I’ve done it again, sorry IVG, thanks for helping out

Hello Pablo_Cortes, the height and width are set to auto as I want the background image to scale in size ( responsive) from device to device, not sure if this is correct???. The image is the background of a section, not a container of div

Thanks for helping

you can use an embed with “object-fit:contain” parameter and then use an image that you place inside the div… or if you use a background select “contain” and then the image will scale with devices.

Hey @webflowmac, is the background image fixed?

I tried your solution IVG but for some reason the background image of the hero section still isnt displaying properly in browser mode, even with padding bottom. I can only seeing half of the background image in the browser instead of the full background image

Hello Pablo_Cortes, no the background image for section 2 isnt fixed

So you still haven’t posted your readonly link - so there is only so much we can help you with… please post it and I will try and help…