Search code examples
csscross-browserradial-gradients

CSS radial gradient not working in Mozilla


I have the following CSS code:

background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#7b7878), to(@white));
background: -moz-radial-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#7b7878), to(@white));
background: radial-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#7b7878), to(@white));

Which is responsible for the following styling:

enter image description here

It works in Chrome, but this is not working in Firefox and IE. What am I missing here??


Solution

  • use this code, this will work on IE 10,google chrom 26.0,fire fox 16.0 ,opera 12.1 and safari 6.1:

      width:100%;
      height:3px;
      background: -webkit-radial-gradient(#7B7878 1%, #BBBBBB 30%, #CCCCCC 40%, #FFF 70%);
      background: -o-radial-gradient(#7B7878 1%, #BBBBBB 30%, #CCCCCC 40%, #FFF 70%);
      background: -moz-radial-gradient(#7B7878 1%, #BBBBBB 30%, #CCCCCC 40%, #FFF 70%);
      background: radial-gradient(#7B7878 1%, #BBBBBB 30%, #CCCCCC 40%, #FFF 70%);
    

    And also give the same result as you want.