Собираем различные механизмы изменения стилей для мобильной версии.

Изменение направления таблицы

Если у нас есть таблица, например, с перечислением отделов и в моб. версии она не помещается, то мы можем пересобрать её в колонки.

Назначим таблице класс contacts и пропишем стили для моб. версии.

@media (max-width: 768px) {
    table.contacts tbody {display: flex; flex-direction: column; gap: 20px;}
    table.contacts tr {display: flex; flex-direction: column;}
    table.contacts tr td:first-child {font-weight: 600;}
    table.contacts tr td:not(:last-child) {border-bottom: 0 !important;}
}

Таблица примет следующий вид: