Footer display problem in Internet Explorer 7

It is bit weird scenario to explain it in words. The footer of site I'm working on looks good on most of the browsers except IE7. Below are the screenshots will give you the idea.

IE8/FF/Chrome

IE7 (moved half screen right)

The footer has following CSS. When I remove the CSS it displays fine.

#footer-holder
{
    clear: both;
    width: 100%;
    position: fixed;
    bottom: 0px;
    *border: none;
    z-index: 10000;
    height: 30px;
    /* For WebKit */
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.1)), to(rgba(0,100,255,0.70)));
    /* For Mozilla */
    background: -moz-linear-gradient(top, rgba(255,255,255,0.1), rgba(0,100,255,0.70));
    /* For lt IE8 */
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#01FFFFFF, EndColorStr=#A50064FF);
    /* For gt IE8 */
    background: -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#01FFFFFF, EndColorStr=#A50064FF)";
}

I am tired to making it compatible with IE7. Any idea what might be causing the issue?

Upvotes: 2