Background-picture on the whole site, which position to use?

Hi there!

I am having some trouble.

I am using an image as a background for my whole body (so it is not just white). The opacity of the image is set to 15 %, as I like it to not be that obvious. However, because of the opacity-setting, I cannot place the image as a background-picture in the body, as it makes everything the same opacity.

At the moment I have a div-box with the image placed as the background-image of the div-box. I have set this div-box to relative position, and then everything I place in the site absolute position (as I would do, if I had a picture, and I wanted some text on top of this p


icture)…However, this it not a good solution, it turns out…the smart thing about the static position is that new elements I place in the page, will take a new space and not be on top of each other as it happens with the relative and absolute position.

Do you have any suggestions?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi, your read only link doesn’t work but I think I can help. So you may be over complicating this. Why not simply edit the image outside of Webflow to be exactly how you want it to look and then apply it as a background image to the body instead of dealing with opacity?

That is simply a genius suggestion. Thanks for saving my day, man!

1 Like