IE8 не отображает градиенты ниже области просмотра

Question

На моем интранет-сайте мы собираемся перейти на IE8.В IE6 у меня нет проблем с отображением, однако при тестировании в IE8 я обнаружил, что любой элемент на странице, для которого установлен фильтр: установлен градиент, отображается пустым.

Вот выдержка измоя таблица стилей, которая применяет цветной градиент к левой ячейке таблицы на одной странице (есть другие градиенты, которые я установил, и они все делают то же самое в IE8):

div.render, .render {
    background:transparent;
    position:relative;
    z-index:5000;
    }
#web { border-top: 2px solid #3868A0; }
.dlblue, .dlred, .dlgreen, .dlteal {
    color:#FFFFFF;
    font-weight:normal;
    width:30px;
    padding: 5px 10px 5px 2px;
    line-height: 18px;
    background-color:#EEEEEE;
    overflow:auto;
    }
.dlblue div, .dlred div, .dlgreen div, .dlteal div {
    text-align:center;
    text-shadow: -1px 1px 0px #FFFFFF;
    height:1em;
    filter:progid:DXImageTransform.Microsoft.Shadow(Color=#FFFFFF, Direction=135, Strength=1);
    -ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Color=#FFFFFF, Direction=135, Strength=1)";
    /*filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color=#FFFFFF, Positive='true');
    -ms-filter:"progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color=#FFFFFF, Positive='true')";*/
    }
.dlblue {
    color:#164680;
    border-left: 2px solid #3868A0;
    background: -moz-linear-gradient(left, #3868A0, #FFFFFF), #3868A0;
    filter:progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF3868A0, endColorstr=#FFFFFFFF);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF3868A0, endColorstr=#FFFFFFFF)";
    }
.dlred {
    color:#990011;
    border-left: 2px solid #CC0033;
    background: -moz-linear-gradient(left, #CC0033, #FFFFFF), #CC0033;
    filter:progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FFCC0033, endColorstr=#FFFFFFFF);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FFCC0033, endColorstr=#FFFFFFFF)";
    }
.dlgreen {
    color:#266006;
    border-left: 2px solid #488028;
    background: -moz-linear-gradient(left, #488028, #FFFFFF), #488028;
    filter:progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF488028, endColorstr=#FFFFFFFF);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF488028, endColorstr=#FFFFFFFF)";
    }
.dlteal {
    color:#003640;
    border-left: 2px solid #005860;
    background: -moz-linear-gradient(left, #005860, #FFFFFF), #005860;
    filter:progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF005860, endColorstr=#FFFFFFFF);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(enabled=true,GradientType=1,startColorstr=#FF005860, endColorstr=#FFFFFFFF)";
    }

У меня естьперепробовал все, что я могу придумать, чтобы заставить его правильно отображаться на странице, однако, ничто не заставляет градиент появляться для любого элемента, который изначально находится ниже области просмотра.Это просто ошибка IE8?Если так, я найду другой способ придать стиль этим предметам.Если нет, я открыт для предложений о том, как это исправить.

Вот код для одной из таблиц, которые используют стиль (div render используется для исправления странности текста в IE - существует проблема с градиентом)с примененным или без него, и PHP просто отображает текст в столбце по вертикали):

<table border="0" cellpadding="3" cellspacing="0" width="90%">    
<tr valign="top"><td ID="web" class="dlblue" width="25"><div class="render">
<img src="/icons/space.gif" width="30" height="1" alt="" border="0"><br>
<?
$browsertext = 'BROWSER TOOLS ';
$browsertools = wordwrap(preg_replace("/\s| |&nbsp;/", "  ", $browsertext), 1, "<br>\n", true);
echo $browsertools;
?>
</div></td>
<td ID="web">... other content for the table</td></tr>
</table>

Спасибо!Дайте мне знать, если потребуется дополнительная информация.

Answer 1

Да ... Я использую некоторые CSS, чтобы расположить нижний колонтитул внизу страницы, когда содержимое страницы короче, чем область просмотра (и помещает его в конец содержимого, когда требуется прокрутка).

Я удалил CSS, который заботится о размещении нижнего колонтитула и вуаля, градиенты отображаются, как и ожидалось.Этого не было в IE6 или FF, но, поскольку мы переходим на корпоративный стандарт IE8, я изменю дизайн на этих страницах на то, что все время появляется в футере css.Более важно сохранить код размещения нижнего колонтитула, чем градиенты.

Спасибо за упоминание этого - никогда бы не подумал об этом самостоятельно - и я буду помнить об этом при разработке будущих страниц.