Bàn CSS, trật tự Invert nội dung hiển thị

Question

Tôi biết đây là một cạnh chảy máu chút, nhưng đây là câu hỏi anyway:

Với

<div id="one">First Div</div> 
<div id="two">Second Div</div> 

...

#one, #two { display: table-cell; } 

.. cho tôi một sự sắp xếp bên cạnh đáng yêu của div với #one ở bên trái và #two ở bên phải.

Có cách nào để đặt #two ở bên trái và #one ở bên phải, sử dụng display: table-cell; và không thay đổi thứ tự của các div trong HTML?

Tôi hỏi, vì tôi muốn giữ #one ở trên #two trong HTML vì lý do SEO, nhưng tôi muốn #two ở bên phải #one vì lý do thẩm mỹ. Tôi biết làm thế nào để làm điều này bằng cách sử dụng nổi/định vị tuyệt đối/lề/etc, nhưng tôi đã tự hỏi nếu có một cách tôi có thể làm điều đó bằng cách sử dụng các thuộc tính hiển thị bảng CSS mới hơn (mà tôi rất thích).

Mọi suy nghĩ?

Answer 1

Bạn có thể (ab) sử dụng văn bản hướng cảnh báo, ác trước:

<div id="container"> 
    <div id="one">First Div</div> 
    <div id="two">Second Div</div> 
</div> 

<style> 
    #container { direction: rtl; } 
    #one, #two { display: table-cell; direction: ltr;} 
</style> 

Answer 2

<div class="container"> 
     <div class="middle" style="background-color: blue;"> 
      <h4>Left Col placed middle</h4> 
      <p>...</p> 
     </div> 
     <div class="right" style="background-color: red;">   
      <h4>Middle Col placed right side</h4> 
      <p>...</p> 
     </div> 
     <div class="left" style="background-color: yellow;"> 
      <h4>Right Col placed left side</h4> 
      <p>...</p> 
     </div> 
    </div> 

<style type="text/css"> 
    .container { 
     display: flex; 
    } 
    .container > .left{ 
     order:1; 
    } 
    .container > .middle{   
     order:2; 
    } 
    .container > .right{ 
     order:3; 
    } 

    .left, .middle, .right { 
     display:table-cell;   
    } 
</style> 

tôi sử dụng flexbox. Bạn cũng có thể thay đổi số lượng div. Ví dụ, đặt nhiều div hơn với lớp bên trái, sau đó chúng sẽ được đặt bên trái ngay cả khi chúng được khai báo sau đó.

Tôi đã thử ví dụ @Greg, nhưng nó không hoạt động trên IE.