Не понимаю как сверстать адаптивную таблицу, в которой все элементы меняют свое положение при адаптиве. Понятно, что сам порядок меняется через order, но само позиционирование на маленьком экране без дополнительного оборачивания в дивы не понимаю как реализовать.
https://habr.com/ru/post/320022/ Возможно вам поможет, по факту таблицу родитель делаете флексом, дети - флекс элементы, и там можно вертеть как хотите через css media. В крайнем случае тоже самое можно сделать на гридах, еще легче, используя grid area
нормально таблицу только через table можно сделать. ни гриды ни флексы, только table. можно эмулировать на дивах с display: table, тогда при адаптиве переключаете на display block/flex/grid и позиционируете как надо
на примере цены и кнопки "удалить":
это вложенная в ячейку таблица об одной строке и двух ячейках.
Для мобильных делайте для ячеек этой таблицы дисплей-блок и ячейки встанут друг над другом.
Остальные элементы аналогично
Простой
