Изменение номера ячейки таблицы таблиц CSS

Question

Я строю макет страницы, используя блоки, установленные для отображения: table-cell. Все работает нормально, но я не могу перевернуть ячейки (изменить их порядок) подряд и задаться вопросом, есть ли такая возможность или какой-то трюк, что я могу использовать для достижения этого.

мне нужно для достижения этой цели, используя только CSS и дисплей: таблица-элементный :)

Заранее спасибо за любые предложения.

HTML

<div class="dtc"> 
    <div>Item1</div> 
    <div>Item2</div> 
</div> 

CSS

.dtc{ 
    display: table; 
    width: 100%; 
} 
.dtc > *{ 
    display: table-cell; 
} 

Текущая таблица:

+-------+-------+ 
| Item1 | Item2 | 
+-------+-------+ 

Желаемый результат:

+-------+-------+ 
| Item2 | Item1 | 
+-------+-------+ 

Answer 1

RTL для родителей и LTR для детей. Это изменит порядок.

.dtc { direction: rtl; } 
.dtc > div { direction: ltr; } 

Без текста LTR для детей текст не будет правильно выровнен.