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

Нашел еще один способ перестановки местами нескольких блоков, используя только 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.