How to set the background size for the "cover", as well as a bit more in CSS?

I have a container with a fixed height of 850 pixels. I want a background image that will support the entire background at all zoom levels. I would use background-size: cover , but I need it to be a little bigger than cover do this. I want the background part to exit the container and be invisible to create parallax.

Basically, how can I use background-size: cover and increase the size a bit?

edit: Forgot to mention that I also use background-attachment: fixed , so if I’m not mistaken, it is actually calculated using the size of the browser window (?), and not a container with a height of 850 pixels. How would I add this extra bleeding in this case?

+8
html css
source share
2 answers

Just using background-size: auto 110%; did the trick.

+4
source share

I set the container div: height: 100vh, overflow: hidden; then internal up to 110% (or no matter how much you want in your parallax), now you can change the background property, and the coverage will always work

0
source share

All Articles