linear-gradient not working in Chrome

First of all note that -webkit-gradient was intended by Apple and implemented in 2008 in Webkit based web browsers (for instance Safari 4) which has a pretty different syntax than the W3C standard:

-webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*)

For instance:

background: -webkit-gradient(linear, left top, right top, color-stop(0%,#87e0fd), color-stop(40%,#53cbf1), color-stop(100%,#05abe0));

This is why you couldn't get it to work in your case.

A year later Mozilla introduced -moz-linear-gradient (since Firefox 3.6) which has also a different syntax than the old Webkit version but then it implemented in Webkit under -webkit-linear-gradient:

-moz-linear-gradient([ [ [top | bottom] || [left | right] ],]? <color-stop>[, <color-stop>]+)

However the W3C standard version of linear-gradient is quiet different, the formal syntax of linear-gradient() expression is:

linear-gradient() = linear-gradient(  [ <angle> | to <side-or-corner> ]? ,  <color-stop-list>)<side-or-corner> = [left | right] || [top | bottom]

As can be seen in your posted code, the other mistake is the lack of to <side> in the W3C version. Therefore, in your case it should be:

Example Here.

background: -webkit-gradient(linear, left top, right top, color-stop(0%, transparent), color-stop(50%,#fff), color-stop(100%,transparent)); /* Chrome, Safari4+ */background: -webkit-linear-gradient(left, transparent 0%,#fff 50%,transparent 100%); /* Chrome10+, Safari5.1+ */background: -moz-linear-gradient(left, transparent 0%,#fff 50%,transparent 100%);    /* FF3.6+ */background: linear-gradient(to left, transparent 0%,#fff 50%,transparent 100%);      /* W3C */

Use

background: -webkit-linear-gradient(left, transparent 0%,#fff 50%,transparent 100%);

as the similar definition to Mozilla's.

background: rgb(0,0,0);background: linear-gradient(NaNdeg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);

This is the answer, check it !!!(Note* - NaN is as same as 'xx' means you can change the value as per as need required.)

Or another way is that you can create gradients using Gradient generator.Link to my self-made gradient-generator:- https://dynamicmortal.github.io/GradientGenerator/

(Simply just copy the css generated)