ピクセルギャップのie

Question

いつの部位を使用 絶対 位置決め、それぞれが境界の矩形を形作っていまグループとしてまとめてくるためのように見える場合、Dom要素のページが選択された本作は、cssの境界挙動を本部長としてオーバーレイ).

• 左て ボーダー左設定"4px赤", は、 幅0px、 高さに等しいの高さのDom要素.

• をテーマにワークショップにはボーダートップ設定"4px赤"は、高さ0px、幅と同じ幅の選択したDom要素になります。

など。指導が受けられます。

ごきげんよう、トメ子です奇数、偶数が非常に便利で、 aardvark のための一例です。

そこではどのように見えるようにFF、opera、safari、chrome:

altテキストhttp://img243.imageshack.us/img243/429/captureyv.png

こちらにはどのように見えるように ie8 :

altテキストhttp://img190.imageshack.us/img190/7196/capture1dv.png

ってすぐに感じたのは、ボックスモデルの問題ではないかと狭?とともに、 jquery の幅と高さの一つであり、この問題です。行ったの 最も知られるieのバグ, ることができていないく。

いかがですか？

ps:このbookmarkletのコースを変えようとしたことがわかるdoctypeに地元のファイルをうまくいったものの、生産いることができるのです。

私の家devツールバーを描きボーダの要素として位置づけら絶対:

altテキストhttp://img21.imageshack.us/img21/3425/capture2uc.png

を見ることができる。

Answer 1

IE8の開発者ツールバーでBOTTOM「国境」のdivの「実際」の高さを確認してください。それが "0" であることを確認します。

その下のdivのために、次の試してみてください。

<style type="text/css">
    #bottomBorder{
        /* Adding '!important' to each CSS rule 
           will make sure nothing else in your code is 'overwriting'
           that rule. (doesn't work for IE6)
        */
        line-height:0 !important; 
        font-size:0 !important;
        height:0 !important;
        border-bottom:solid 4px red;
        position:absolute;
    }
</style>

ORてみます：

<style type="text/css">
    #bottomBorder{
        border-top:solid 4px red;
    }
</style>

私は何を考えていると、IEはあなたが高さを0PXするDIVを設定できないということです。私は前にdiv要素でこれを見てきました。

Answer 2

私は、これは通常、正しい方向に向かっIEを取得するよう、あなたのDOCTYPEをいじるべきだと思います。

Answer 3

私はこの問題は余白とパディングとは何かを持っていると仮定します。あなたのdiv要素の内部情報やスペーサーを持っていますか？これは、あなたが考慮していなかった余分なスペースにつながる可能性があります。

私は余裕でdivを調整します：0;国境崩壊：崩壊;

あなたが言及したように、

また、一番下のDIVの上に、あなたは試してみて、DIV自体の内の任意の余白や間隔が原因で発生から、このようなギャップを防ぐために、その上部の境界線にそのセットを持っている必要があります。

Answer 4

これはIE8は、その高さパラメータの一部として、境界線の高さを含めていないことだろうか？同様に境界のサイズを追加してみてください。

Answer 5

[OK]を、私は今のところ何の解決策を持っていないが、私はちょうど下のdivのボーダートップの代わりに、その境界線の下を表示し、それが今のenoughtよさそうです。いずれかが良く知っている場合、彼はまだ大歓迎です。