Background gradient IE7 CSS problem

Total Post:135

Points:947
 1784  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. 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