[css] CSS3 gradient background set on body doesn't stretch but instead repeats?

Here's what I did to solve this problem... it will show the gradient for the full length of the content, then simply fallback to the background color (normally the last color in the gradient).

_x000D_
_x000D_
   html {_x000D_
     background: #cbccc8;_x000D_
   }_x000D_
   body {_x000D_
     background-repeat: no-repeat;_x000D_
     background: #cbccc8;_x000D_
     background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#cbccc8));_x000D_
     background: -moz-linear-gradient(top, #fff, #cbccc8);_x000D_
     filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cbccc8');_x000D_
   }
_x000D_
<body>_x000D_
  <h1>Hello world!</h1>_x000D_
</body>
_x000D_
_x000D_
_x000D_

I've tested this in FireFox 3.6, Safari 4, and Chrome, I keep the background-color in the body for any browsers that for some reason don't support styling the HTML tag.