MyBB Community Forums

All my attempts at doing this have failed. It's making it work with the rest of the CSS and html in mybb that I can't do. Any assistance?



^Image I would like to be scaled to fit the screen

Thanks for any support

IIRC the problem is that HTML and CSS don't do scaling background images. There may be a way to do it using layering and an actual < img > tag, but it might not work and even if it does, it may break easily.

What I did for my site was make the background image a reasonably generic height of 512px, then using CSS repeated it horizontally, stuck it to the bottom, and set the background color to the top.

You can click my sig to see, it's the 'border' around the main page.

The body tag CSS:

background: #000000 url(images/firebird/blue/borderpic.png) repeat-x fixed bottom center;

If you're using it for some element's background, like a box within the page, you should remove the 'fixed' from the code above, and obviously you should replace the image path with your own.

Hmm... Personally I would use top instead of bottom, seems to work better for me and is a little more accurate, mostly because it tends to shift when I use bottom.

background: #000 url(http://img32.picoodle.com/img/img32/3/11/15/f_bgm_2cb8c9d.gif) repeat-x fixed top center;

I just used bottom for mine because the top was a solid color while the bottom was an image. For just a gradient, either would work, and in fact I use top for the gradient backgrounds for many of the other elements on my site.