Linear gradient not working in Chrome even with vendor prefix

Question

I am using this as a background for one of my divs and declared a vendor prefix for all:

background: -webkit-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -moz-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -o-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -ms-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;

However, it doesn't in Chrome. My div becomes transparent instead (because it doesn't recognize a background at all). My Chrome version is Version 29 which is supposed to be up to date.

Did I do anything wrong?

Answer 1

As already mentioned in the comments, center is an invalid property for linear-gradient. For an in-depth look at the syntax, the Mozilla Developer Network covers this pretty well:

linear-gradient([<angle> | to <side-or-corner> ,]? <color-stop> [,<color-stop>]+)
                \--------------------------------/ \----------------------------/
                  Definition of the gradient line       List of color stops  

top, bottom, left and right are the only properties the <side-or-corner> parameter accepts.

If you're unable to work the gradient manually, there are various online tools which can help you create the gradient you're looking for, one of the better ones is Colorzilla's Ultimate CSS Gradient Generator.