CSS-絶対位置づけdivsないこだわりる際に使用することができます。が"right:0px"IE6

StackOverflow https://stackoverflow.com/questions/1329198

質問

この一例 こちらの の角を丸めを使用単一のイメージです。私はこの作業を完全にIE7+としています。

以下の例ではタブレイアウト:

<div class="tab"><div class="corner TL"></div><div class="corner TR"></div>
    <div class="inner"><p>Test 1</p></div>
</div>
<div class="tab"><div class="corner TL"></div><div class="corner TR"></div>
    <div class="inner"><p>Test - 2</p></div>
</div>
<div class="tab"><div class="corner TL"></div><div class="corner TR"></div>
    <div class="inner"><p>Test - 3</p></div>
</div>

それだけではないですが、もうCSSスタイル:

.corner
{
        background:url(../Images/LightCorner.gif);
        position:absolute;
        width:13px;
        height:13px;
        overflow:hidden;    
}

.inner
{
        position:relative;
        padding:13px;
        margin:0px;
}

.inner p
{
        padding:0px;
}

.tab
{
        color:#FFF;
        float:left;
        font-weight:bold;
        margin-right:5px;
        position:relative;
        text-align:center;
}

.tab p
{
        margin:0px;
        padding:0px;
}

.tab
{
        background:#B5B5B5;
}


.TL
{
        top:0px;
        left:0px;
        background-position:0px 0px;
}
.TR
{
        top:0px;
        right:0px;
        background-position:-13px 0px;
}

.TL, .TR
{
        margin:0px;
        padding:0px;
        position:absolute;
}

の問題が私の部の幅は 番、終わ1px右ボーダーとしても右上部は実際のとして位置right:1px.の幅は 奇数 番号をうまくいかないときは右グレー色のタブを本部長として表示されます。

画像を使用していき こちらの.例です こちらの.

なぜ右上部ていないの位置が正しくでright:0px?なのはなぜで終わ1pxギャップIE6の場合はタブの幅がかかりますか?

役に立ちましたか?

解決

の問題が私の部の幅 はもっと1px 右ボーダーとしてもトップ 右divることによって位置づけ としてright:1px.の幅が奇 番号をうまくいかないときは右手 灰色のタブに本部が として表示されます。

あとのコードでは、バグInternet Explorer6.時の絶対位置決めるものの、実際の位置は四捨五入2pxを1px"証拠金"の合計幅/高さはもは奇数).残念ながら、必要なwebブラウザでJavaScriptの実行を固定します。

確認できます この例では、 (記述より)ゆっくりサイズの変更にIE6画面ピクセル-イ-ピクセルになります。また、位置の下と右の箱が更新されたピクセルです。もっとも発見されたこのバグに 当サイトで.

しかし、私は書くための固定高さの計算が配置のグループ内でもトップクラスおよび残高としてオートになります。使ってい このスクリプトこのサイト.だが、このスクリプトに変更ができる計算のオフセットに基づく available_width-(right+width).

他のヒント

してください

body{ margin:0;}

また:

right:-1px;

のためのIE6

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top