CSS3 - background: radial-gradient --stretch height to 100%

hi Experts
I recently discovered this wonderfully low memory alternative to an entire background image that is the CSS3 radial gradient.
here's my website: www.georgehowell.com.au
However, it seems to repeat at the end of whatever content is on the page.. Eg, where the last div tag is, is where the gradient will stop and start again.
Here's my CSS:
http://www.georgehowell.com.au/css/style.css

does anyone know an easy way to make it 100% height in every page. ie, is there a CSS selector or markup to stretch it 100% of the screen / browser window height in every scenario... responsive somewhat?
georgehowellAsked:
Who is Participating?
 
Jagadishwor DulalBraces MediaCommented:
Change your body style to like fixed and no-repeat Like:

body {
    background: radial-gradient(ellipse at center center , #848484 1%, #000000 100%, #000000 100%) repeat fixed 0 0 ;
    font-family: Marcellus SC,arial,verdana,tahoma;
}

Open in new window

0
 
Julian HansenCommented:
Try adding this
html {
   height: 100%;
}

Open in new window

0
 
georgehowellAuthor Commented:
thanks for your solution Jag
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.