Any ideas for a solid double background that is cross compatible?

[MGuise]

I’m trying to build a background on my website and I am having trouble with the way I have the CSS set up. You can see what I have built so far here.

http://www.webskillsplus.com/packwood/index.php

Take a look at the attached image and you can see what I am trying to accomplish. I would like a red bar to run horizontally behind the page.

I tried messing with the z index with an absolute position but I couldn’t get it to work.

I tried doing the following and it isn’t working either.

html {
	background: #ccc url(../img/dice_slice.jpg);
	background-repeat: repeat-y;
}
body {
	margin: 0;
	background-color: #b87431;
	background-image: url(../img/massageservices.jpg);
	background-position:center;
	background-repeat: no-repeat;
}

Anyone have any ideas? Thanks in advance for your help.

[chryaner]

listen to what i did...

there is a div in your site that contain the whole site
i took it and added a id, for this example i called it bg_test --->

<div id="bg_test" style="overflow: hidden;">

i went to your css file --> massage.css
took your 'body' selector and change it to the id i've added --> #bd_test
i've deleted the background-color property so it wont color the background since you put it in the html selector.

looks like this:

#bg_test {
    background-image: url("../img/massageservices.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    margin: 0;
}