CSS方向RTL元件順序問題

我有這樣的HTML：CSS方向RTL元件順序問題

<body style="direction: rtl"> 
    <div style="display:inline-block"> 
     <span>x:</span> <span>1</span>, 
     <span>y:</span> <span>2</span> | 
     <a>link1</a> | 
    </div> 
    <a>link2</a> 
</body>

隨着方向：LTR它顯示：

x: 1, y: 2 | link1 | link2

但是，當我將其更改爲RTL是示出了：

link2 | x: 1, y: 2 | link1

雖然我期望：

link2 | link1 | 2 :y ,1 :x

有沒有辦法設置CSS屬性來實現預期的結果，但不修改DOM元素結構（元素的類型可以更改）？

來源

2010-03-30 Jacek Kołodziejczyk

試試這個：

<body style="direction: rtl"> 
    <div style="display:inline-block"> 
     <span dir="rtl">x:</span> <span dir="rtl">1</span>, 
     <span dir="rtl">y:</span> <span dir="rtl">2</span> | 
     <a>link1</a> | 
    </div> 
    <a>link2</a> 
</body>

這給了我想要的東西。

來源

2010-03-30 15:15:07 brainjam

謝謝，它的工作 – 2010-03-30 17:26:34

謝謝。我有我的div style = inline。一旦我改變它內聯塊它的工作。再次謝謝你。 – moeabdol 2015-08-07 16:39:22

變化inline-block的內聯柔性

<body style="direction: rtl"> 
    <div style="display:inline-flex"> 
     <span>x:</span> <span>1</span>, 
     <span>y:</span> <span>2</span> | 
     <a>link1</a> | 
    </div> 
    <a>link2</a> 
</body>

這將作爲您想在FF &瀏覽器，但不顯示在IE瀏覽器。

來源

2013-11-07 18:17:47 Khattab

對我來說，它的工作，但我害怕打破其他東西....我運行任何測試來驗證？ – 2017-03-14 13:09:24

CSS方向RTL元件順序問題

回答

相關問題