BACKGROUND GRADIENT IE7 CSS PROBLEM

Chintoo Semi

Total Post:135

Points:947
Posted by  Chintoo Semi
 1442  View(s)
Ratings:
Rate this:

Hi every one,

I am using the following bit of CSS to create a linear background gradient. It seems to work just fine in IE8/9, Firfox, Safari and chrome but not in IE7. IE7 shows a solid (green) background. Could anyone, who is familiar with this problem, please help me out?

This is my code

.menu_body a {

display:block;

color:#006699;

background: #008800;

/* Mozilla: */

background: -moz-linear-gradient(top, #0b71a4, #025f8e);

/* Chrome, Safari:*/

background: -webkit-gradient(linear,

            left top, left bottom, from(#0b71a4), to(#025f8e));

/* MSIE */

filter: progid:DXImageTransform.Microsoft.Gradient(

            StartColorStr='#0b71a4', EndColorStr='#025f8e', GradientType=0);

padding: 1px 18px;

}

Thanks in advance

  1. AVADHESH PATEL

    Post:604

    Points:4228
    Re: Background gradient IE7 CSS problem

    Hi Chintoo Semi


    You can try this code

    In IE 7 or Greater than IE 7 version, filters won't work unless element has layout.

    zoom: 1;
    Be aware that it can break other things, so old good background-image might be safe and reliable solution.

    Also please note that your CSS lacks gradient properties for Opera, IE10 and updated syntax for Webkit.

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!