3

2つの要素を右にフロートさせるたびに、それらは交換されるようです。これは、左にフロートされた要素では発生せず、すべてのブラウザで発生しているようです。

次に例を示します。

コード：

<style type="text/css">
    .right {
        float: right;
    }
</style>
<div class="right">DIV ONE</div>
<div class="right">DIV TWO</div>

レンダリング：

DIV TWO DIV ONE

これは実際には大きな問題ではありませんが、同僚とコードを交換するときに混乱を引き起こします。これを防ぐ方法はありますか？

4

2 に答える 2

6

別の可能なオプションは、正しくフローティングする代わりに、ただtext-align: right;。次に、各DIVをのdisplay: inline-block;代わりにマークしblockます。正確な状況によっては、これが問題を引き起こす可能性がありますが、他の多くの場合は問題なく機能します。

問題が発生した場合は、2つのDIVをラッパーに貼り付け、それを右側にフロートさせてから、私のソリューションを使用できます。ただし、それは少し意味論的ではありませんが、最終的にはそれほど重要ではないと思います。それはあなた次第です！

于 2012-06-28T17:06:11.083 に答える
1

別の左に浮かぶ要素にぶつかるまで可能な限り左に浮く左浮き要素のように、右に浮かぶ要素は、別の右に浮かぶ要素にぶつかるまで可能な限り右に浮きます。これは実際には良好で一貫性のある動作であり、一見すると混乱を招きます。

本当に頭がおかしいと感じたら、事後に要素をJavascriptと交換するようなことを試してみてください…しかし、それはJS以外のユーザーに大混乱をもたらし、最終的には問題をさらに混乱させます。振る舞うことになっています。HTMLの順序を入れ替えることは、本当にここに行く方法です、ごめんなさい：/

于 2012-06-28T16:53:49.130 に答える