CSS3 gradient not scrolling properly

Question

Here is my site here: Link

I've looked around for a bit but couldn't find what I was looking for. I'm attempting to use CSS gradient for my website background but it is not resizing properly. Instead it will repeat itself when you have to scroll. Even with background-repeat set to no repeat, I am still having this problem. Anyone know what my problem is? Here is my css.

html{
height:100%;
}
body {font: 14px/normal Tahoma, Arial, Helvetica, sans-serif; 
height: 100%;
min-height:100%;
margin:0;
background-repeat:no-repeat;
background-attachment:fixed;

background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#ccc)); 

  background-image: -moz-linear-gradient(top, #000, #ccc);

  background-image: -o-linear-gradient(top, #000, #ccc);

  background-image: linear-gradient(top, #000, #ccc);  

}

Answer 1

The background-attachment:fixed do what you want, but next you are setting background: and overwriting that value. Replace it with background-image and you are done.

Answer 2

background:url(/_pix/bg.png) repeat,-webkit-gradient(linear,left top,left bottom,color-stop(0,#C8AA86),color-stop(1,#664927));
background:url(/_pix/bg.png) repeat,-webkit-linear-gradient(top,#C8AA86 0%,#664927 100%);
background:url(/_pix/bg.png) repeat,-moz-linear-gradient(top,#C8AA86 0%,#664927 100%);
background:url(/_pix/bg.png) repeat,-ms-linear-gradient(top,#C8AA86 0%,#664927 100%);
background:url(/_pix/bg.png) repeat,-o-linear-gradient(top,#C8AA86 0%,#664927 100%);
background:url(/_pix/bg.png) repeat,linear-gradient(top,#C8AA86 0%,#664927 100%);
background-attachment:fixed;