How to make Full Browser Screen Backgrounds (Not Content Cover Backgrounds)


#1

Hi,

How do I make a page like this - http://css-tricks.com/examples/FullPa… - in the editor?

I followed this guide - http://support.unbounce.com/entries/5… - but with this one the background fits all the page content.

I just want the background to fit the user’s browser window and stay constant, even if they scroll up or down.

I found this css code, but am having trouble make it work within unbounce;
#img.source-image {
width: 100%;
position: absolute;
top: 0;
left: 0;
}

Is this possible in unbounce?

Thanks,

-Suraj


#2

Hi Suraj,
If you view the source of the css-tricks.com page you linked to, you’ll see that they use exactly the same trick as on our support article - setting background-size: cover; in the CSS.

So given that this is how our support article is supposed to work, I’m guessing it’s just not working on your page for some reason, and that’s why you’re having trouble. Can you either post a link to the page you’re working with, or send an email to support@unbounce.com (if you’d rather keep the page private) and we can take a look from there?


#3

UPDATE:
We’ve officially launched  Video Backgrounds  into beta as of today. Click the link below and sign up to be an Early Access beta tester!

https://community.unbounce.com/unbounce/topics/early-adopters-try-our-video-backgrounds-beta