Question

Hi..

I have a label whose background is gradient by default(IE ).

     label{
      width:100px;
      height:100px;
      border:1px solid red;
      filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorStr="#ff3333",endColorStr="#663300");
     }
<label> Rama Rao </label>

I am allowing user to change that background color either gradient or normal. I am getting the value that user has entered,and setting css:

<label style="background:#val1"> Rama Rao </label>

OR

  <label style="filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorStr="#val1",endColorStr="#val2");"> Rama Rao </label>

It works if user again sets gradient …but not if user enter normal color…But as per my knowledge,an inline-style can override internal style…..But its not working in filter case (I mean, a filter cannot be overridden by background)…How can I overcome this?
Note : For name shake,I mentioned <label> here…But it may happen for any tag….

Answer 1

You can remove it using this:

filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);

Also you can check this fiddle I made here.

And the code your are using for gradients is for Internet Explorer only. If you want code that is compatible for most browsers check this tool here.