How to create a radial gradient of full coverage?

Question

I use CSS code, for example, the following to create 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 intended! My goal is to have a radial gradient background that spans the entire viewport. I can use the background-size property, which is part of the CSS3 specification, to get a better result, but unfortunately this property does not work in IE?
Does anyone have an idea?

Answer 1

Add this to your CSS:

 html { height: 100% } 

Answer 2

Even better:

 html { min-height: 100%; } 

This will cause the gradient to expand to the level of your content, otherwise it will be limited only by the height of the window.