Radial Gradient, Occupying the whole body?

Question

How would you make a radial gradient occupy the entire body?

At the moment i can make the gradient just fine, but the problem is that the gradient only occupies roughly 100px by 100px. The body background is set to 100%, but still no luck.

Any ideas? Below, is the CSS i'm using at the moment.

body {
  background-color: #2b616d;
  -moz-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
  background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, color-stop(99%, #568b93), color-stop(100%, rgba(0, 0, 0, 0)));
  background-image: -moz-radial-gradient(center center, circle, #568b93 99%, rgba(0, 0, 0, 0) 100%);
  background-image: radial-gradient(center center, circle, #568b93 99%, rgba(0, 0, 0, 0) 100%);
}

Edit1: It seems Firefox is working just fine with the above code, and rather it is Webkit who is having the actual problems. Any help would be much appreciated!

Edit2: According to this link: http://webkit.org/blog/175/introducing-css-gradients/ My use of webkit's "point" is screwed up.. specifically, the radius after each point. The problem is though, that this seems to be an integer only value, as percentages do not seem to work.. Eg, i am trying to make the radius 100%, but only pixel values seem to apply.. any ideas?

Answer 1

For the Mozilla-ish syntax, try this:

[-moz-]radial-gradient(center center, circle cover, #568b93 99%, rgba(0, 0, 0, 0) 100%)
                                             ^^^^^

I don't know what the Webkit equivalent is. If 'cover' doesn't work, try 'farthest-corner'.