Перестановка блоков местами вращением

Нашел еще один способ перестановки местами нескольких блоков, используя только css.

Для примера, некий простенький html.

<table class="demo-rotate">
  <tr>
    <td><span class="demo-rotate__item">первый текст</span></td>
  </tr>
  <tr>
    <td><span class="demo-rotate__item">второй текст</span></td>
  </tr>
</table>

Далее с помощью трансформации вращения, перевернем обрабляющий элемент на 180°, а сами блоки перекрутим назад на те же 180°.

.demo-rotate {
  transform: rotate(180deg);
}
.demo-rotate__item {
  transform: rotate(-180deg);
}

Наглядно, процесс перемещения виден при наведении курсора.

А если использовать матрицу преобразований, то теоретически этот способ может заработать и в старых версиях ie.