XF 1.4 Background Image

[Bob_R]

Trying to have a background image which covers the entire screen.

Tried this in Styles Properties - General - HTML

#content {
background: url("/styles/drift/drift/brownbkgd.jpg") no-repeat;
background-color: transparent !important;
height: 100%;
width: 100%;
}

And it rendered in the upper left corner and that's it. Is it better to use EXTRA.CSS instead?

Thanks!

 

[Bob_R]

OK, I'm getting closer. Just doesn't go all the way down the page. See screenshot to see what I did. Can someone help me finish it off?

TY.

 

[Bob_R]

Got it. Was using no-repeat instead of repeat.

 

[CMGDevel]

Do you have an example URL where this is live? I'd love to see it. And did you end up doing this in EXTRA.CSS?

 

[Bob_R]

See my screenshot from post #2. Use Repeat not no-repeat. Upload image you want to appropriate place. No EXTRA.CSS code needed.

For the record, after all the figuring out I took down that theme.

 

[pfernand]

How big does the image need to be? What size did you use?

 

[TPerry]

Most likely it will depend on whether you are using a static image for the background (just one photo to cover the entire page) or if you are using tiled images. If tiled, the size is not really important - but smaller is better.

 

[pfernand]

i'm using a static image.

 

[TPerry]

It's a fine line.. there is no definite answer unless you are using something like backstretch.

 

[pfernand]

i ended up using an image that was 3000 x 2000 and added css ( background-size:cover; ) and it seems to fit ok now. thanks