html - div の子の順序を逆にする

Question

純粋な CSS で div の子の順序を逆にするにはどうすればよいですか?

例えば：

私が欲しい

<div id="parent">
    <div>A</div>
    <div>B</div>
    <div>C</div>
    <div>D</div>
</div>

次のように表示されます。

D

C

B

A

JSfiddle でデモを作成しました: http://jsfiddle.net/E7cVs/2/

Answer 1

現代の答えは

#parent {
  display: flex;
  flex-direction: column-reverse;
}

Answer 2

表示: テーブル ヘッダー グループ; 表示: テーブル フッター グループ;

子供のための

表示: 表;

親のため