The size of image and making it fit with my site

[TheApprentice]

Okey so after been figureing out what program to use and been taught some stuff about CSS backgrounds and such.

I now have a new question and hopefully I'm not spamming these forums in your eyes, I'm just eagier to learn this lot.

I have problems with my image background not fitting properly, I created my own background in photoshop, but once I put it into my file and opload it to my site, a wide margin appears to the right. Also if I scrool down the page it'll stop.

Is there a way to put the picture to fill % of my site, maybe 100% so the site is covered in my background picture and won't have any white margins.

My picture is not a repeat sort. It's a picture of some mountains and some animals etc.

Hope you can help.

 

[Brillig]

Can you post a link?

 

[Absolution]

With bitmap type images I haven't had a problem, but with SVGs I have had that problem. Don't know how to fix it yet though.

 

[DesignerBill]

Normally your background image will always render at its actual size. Maybe you could resize it in Photoshop to exactly fit in a container div for all your page content, and choose a compatible color for the rest of the page background. That said, there is a CSS3 property called "background-size" but it does not have wide browser support yet. You might search the web for "css background-size" and see what you find.

This page gives some alternate techniques to stretch a background image. But your image sounds like one that can't be stretched without distorting it.

Hope this is helpful to you. I learned something myself.