CSS Resizable Background Image Problem

[Shellac_01]

Hi Guys,

I’ve been trying to apply this process https://css-tricks.com/how-to-resizeable-background-image/ and http://www.cssplay.co.uk/layouts/background.html to my website http://www.ashesandiron.com but I cannot get it to work. When I insert the necessary:

#background{position:absolute; z-index:1; width:100%; height:100%;}

div with img id info

in the appropriate location, all of my content, headers, text, etc. is left justified and the the image covers half the content and the rest of the right hand side of the screen.

I also tried using this code:

html, body {
height: 100%;
margin: 0;
padding: 0;
}
#background {
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
}
#content {
position:relative;
z-index:1;
}

But with this modification the image is centered and all content is shifted directly below it (with an obvious white background).

Any clue how I can get this to fly?

Thanks,

Shellac_01

[Author]

Posts