Streaming live at 10am (PST)

Background image help


#1

Hello!

So I want my background image to be fixed but I want it to resize to fit whatever size monitor it's on so there isn't access white space at the bottom of the screen. How can I achieve this? It's driving me insane!


#2

If you want the image to fit the whole screen, set the height to 100vh. VH stands for viewport height. You can also use vw if you want a certain object to fit the whole width of the screen.


#3

@DharmaNode thanks so much! This was driving me insane!


#4

Great! Glad i could help :smiley:


#5

Okay so this doesn't work.... Unfortunately when you minimize the screen (yes it is full width and height) BUT when you scroll down it's all white space now...


#6

http://hunters-seat.webflow.io/


#7

Could you share your read-only link, please?


#8

@Sabanna https://preview.webflow.com/preview/hunters-seat?preview=dbd0183a7b4dffbcf31d6890dc1abfc8

Thanks!


#9

Do you want the background image to be static and fixed to function as a background for the whole site? if so, you can change the 100vh in the mainsection class to auto.


#10

Well, I am not quite sure what kind of resizing you meant.
Here is video shows how to fix the issue https://youtu.be/2sA3F6RshKA

At the end I showed how to make background "resize" not only on the width but on the height too.

Hope it helps.

Cheers,
Anna


#11

@DharmaNode @Sabanna it's still not working; I'm trying to get it height wise..... no matter what I do (it needs to be fixed so the back doesn't move) and full height..... but without crazy stretching it.... :sweat:


#12

See all the white space? No matter what I do it's not working height wise... and when I do the 100VH for height, and if I shrink the screen the white appears still...


#13

Ooook :smiley: now I got it

So you need to apply background image to body, not to the section or div :wink:
Make it "fixed" and "cover" and you will get what you want


#14

@Sabanna Ahhh! I knew there was a simple fix! Let me try that! Lol, stinking Mondays!


#15

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