Why is my linear gradient not working in Firefox?

Question

I am testing my application on Firefox 33. I have a simple background property set with a gradient:

background: linear-gradient(bottom, #004771 0%, #005185 100%);

and it does not work. CanIUse reports that gradients in Firefox 33 can be used without a prefix. So why is this not working? If I add a Mozilla specific prefix:

background: -moz-linear-gradient(bottom, #004771 0%, #005185 100%);

everything is working fine.

Answer 1

When using a linear gradient without a prefix, you need to write it as follows ("bottom" instead of "bottom"):

background: linear-gradient(to bottom, #004771 0%, #005185 100%);

EDIT: : https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient#Syntax

Answer 2

to bottom, :

background: linear-gradient(to bottom, #004771 0%, #005185 100%);

jsfiddle