Fit background across screen, regardless of screen size

ameliecafe · #1 Dec 21, 2010, 10:28 AM

Here is the site I'm working on: http://blog.aimeenez.net/
Atahualpa Version: 3.4.9

I'm designing this for a friend. She said that on her gigantic imac screen, the peacock on the left shows up on the right side of the screen as well -- that is, the background is tiling horizontally (the peacock is only supposed to show on the left side.)

I tried to look for a solution to this and found a suggestion to paste these lines in:

HTML 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;
}

I put them into the ADD HTML/CSS INSERTS section, but my friend tells me that the repeating problem is still there. Am I supposed to paste the code somewhere else?

Is there any line of code I can put in that will stop the background from tiling horizontally, regardless of screen size? I'd like it to simply fit across the whole screen or resize itself or something.

I have no problem with the background tiling vertically, especially since some of her pages are longer than the backgrounds actual dimensions.

Thanks for the help!