如何创建全覆盖径向渐变？

Question

I'm using a CSS code like the following one for creating a radial gradient background:

body
{
background-color:   #0176A0;
background-image:   -moz-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -webkit-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -o-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -ms-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
filter:             progid:DXImageTransform.Microsoft.gradient(startColorstr = '#029CC9', endColorstr = '#005077', GradientType = 0);
}

but the result is not the intended one! My aim is having a radial gradient background which covers the entire viewport. I can use the background-size property which is a part of CSS3 specification to get a better result, but unfortunately this property does not work in IE?
Does anyone have an idea please?

Answer 1

Add this to your CSS:

html {
    height: 100%
}

Answer 2

Even better:

html {
    min-height: 100%;
}

This will make the gradient extend to your content height otherwise it will be limited to just the window height.