IEフローティングボーダーBUG_Experience交換の拡張に関する議論

CSS ボックス モデルに詳しい友人は、IE の二重フローティング ボーダーのバグに見覚えがあると考えています (よくわからない場合は、クリックしても問題ありません)。浮動行なので、最初の浮動要素の場合、外側のマージンを使用しないと二重スペースが発生しません。しかし、最近、IE にこのバグの拡張機能があることを発見しました。

問題
次の例では、すべての図形の浮動行の最初の浮動要素の外側パッチマージンが 0

#left2 の左マージンは 50px で正常に表示されます

#left2 の margin-left が 100px の場合、正常に表示されます

次に、#left2 の margin-left を 150px に増やします。

#left1 の幅を 110px に変更しますが、#left2 の左マージンは引き続き 150px のままです

上記の現象を見ると、IE には実際に性格があることがわかりました。この性格はどのように理解されるのでしょうか。実際、注意深く見てみると、#left2 の margin-left が #left の幅以下の場合は正常に表示されますが、幅を超えると問題が発生することがわかります。 #left2 の実際の左境界距離は #left1.width+(#left2.margin -left - #left1.width)*2 に等しいです。
解決策
このバグを解決するにはこれは実際には非常に簡単で、倍の距離の解決策と同じように、#left2 {display:inline} を設定すれば OK です。
概要
重要なのは、これがバグの拡張であると述べた理由です。なぜなら、それが二重のバグであっても、この間違ったアルゴリズムのバグであっても、それは一度しか出現しないからです。 。まだ理解していないかもしれませんが、次のように言ってください:

1. #left1 の margin-left が 0 より大きい場合、#left1 の左境界線は 2 倍の距離のバグを引き起こし、#left2 の margin-left はそれより大きくなりません。 #left1 の幅。何か問題が発生します;

2. left1 の margin-left が 0 に等しく、#left2 の margin-left が #left1 の幅より大きい場合、左側の間違ったアルゴリズムにバグが存在します。 #left2 の境界線に、#left3 が存在する場合でも、#left3 の margin-left は #left2 の幅と同じ大きさであり、間違いはありません。

3. left1 と left2 の margin-left が両方とも 0 に等しい場合、#left3 があり、#left3 の margin-left が (#left1 の幅の合計) より大きい場合。および #left2)、その後 #left3 不正なアルゴリズムのバグが左境界線に表示されます。実際の左境界線は (#left1.width+left2.width)+(#left3.margin-left-#left1.width-left2.width です。 )*2、そして #left3 の後のもの すべての浮動要素は失敗しません。

上記はすべて左側の例であり、右側の状況は同じです