IE6のCSS変動高さの問題

Question

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は、絶対的なポジショニングに関しては非常に悪いです。左と右、または上下から何かを同時に配置するだけでは機能しません。

基本的に4つのオプションがあります。

1. IE6のサポートをドロップします。
2. 絶対的なポジショニングをあきらめ、他の方法（たとえばフロート）を使用します。
3. IE6用のサイトの馬鹿げたバージョンを提供します。たとえば、条件付きコメントを使用していくつかのスタイルをオーバーライドします。
4. JavaScriptを使用して、IE6をポジショニングに支援します（たとえば AbsoluteFudge.js).