Проблема с переменной высотой CSS в IE6

Question

У меня проблемы с позиционированием левой боковой панели (изменение высоты DIV) на IE6.

Основные потребности: 1. Я не могу установить значение высоты, потому что высота меняется и должна быть вычислена браузером. 2. Боковая панель должна иметь верхний и нижний интервалы.

Проблема с верхней панелью решается путем замены позиции на относительную.

Есть идеи? Заранее спасибо!

Ниже вы можете увидеть упрощенный код и снимок, как он выглядит в стандартных браузерах.

.container {
    left: 550px; 
    top: 10px; 
    width: 196px; 
    position: absolute; 
    line-height: 0px; 
    font-size: 1px;
}
.inner {
    width: 100%; 
    height: 114px; 
    background-color: rgb(227, 227, 227);
}
.leftbar {
    left: 0px; 
    top: 7px; 
    bottom: 7px; 
    width: 4px; 
    position: absolute;
    background-color: rgb(111, 111, 111); 
}
.topbar {
    left: 7px; 
    top: 0px; 
    right: 7px; 
    height: 4px; 
    position: absolute;
    background-color: rgb(111, 111, 111); 
}

<div class="container">
    <div class="inner"></div>
    <div class="leftbar"></div>
    <div class="topbar"></div>
</div>

ССЫЛКА НА ЭКРАН СНИМКА ИЗОБРАЖЕНИЯ

Answer 1

IE6 чрезвычайно плох, когда дело доходит до абсолютного позиционирования. Позиционирование чего-либо одновременно слева и справа или сверху и снизу просто не работает.

У вас есть четыре варианта:

1. Поддержка Drop для IE6.
2. Откажитесь от абсолютного позиционирования и используйте другой метод (например, с плавающей точкой).
3. Предоставьте неработающую версию сайта для IE6 - например, переопределение некоторых стилей с помощью условных комментариев.
4. Используйте JavaScript, чтобы помочь IE6 в позиционировании (например, absolutefudge.js ).