stretch the background image of the site?

Page 1 of 1 1
Forum moderator: bigblog

laserist

Posts: 62

Reputation: 0

Message # 1 | 12:18 PM 2014-01-29

How can I set in CSS for my site background image to stretch and fill the whole window of the browser? Right now the image is set to repeat itself.

Code

#wrap {background: www.example.com/1.jpg) repeat top center;}

Animorph

Posts: 2856

Reputation: 189

Message # 2 | 1:33 PM 2014-01-29

laserist, This should help smile

Code

#wrap {background: url(images/bg.jpg) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;}

To busy building a passive income online ;)

laserist

Posts: 62

Reputation: 0

Message # 3 | 2:06 PM 2014-01-29

What do these do?

Code

-webkit-background-size, -moz-background-size, -o-background-size

Thanks!

Animorph

Posts: 2856

Reputation: 189

Message # 4 | 7:18 AM 2014-02-01

laserist, Just add it wink

it will work but i would recommend you to do this:

Find your HTML css code

replace it by this

Code

html {
   background: url(images/bg.jpg) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

do this instead of using the wrap background , as it's always at least the height of the browser window

Added (2014-02-01, 1:18 AM)
---------------------------------------------
- Moved to Custom Solutions -

To busy building a passive income online ;)

stretch the background image of the site?

Page 1 of 1
1