Search code examples
cross-browsercssmozilla

Converting -moz-linear-gradient For All Other Supporting Browsers

Here's my rule:

#element {
  background: -moz-linear-gradient(center top, #FFF 8px, #F2F2F2 24px, #F2F2F2 100%) repeat scroll 0 0 #F2F2F2;
}

I want to take that rule and apply it to all of the browsers that support a linear gradient. What would this rule's syntax look like for Chrome, Safari, and ... Internet Explorer?

I'm considering making a super simple web app that will take a CSS file with Mozilla rules and kick out the other browser's implementations of the rules as well.

Solution

  • Here are the gradients as requested...

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000');
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));
background: -moz-linear-gradient(#EEFF99, #66EE33);
background: linear-gradient(#EEFF99, #66EE33);