@anvarik2

Как адаптировать таблицу?

Суть в том, что есть такая таблица:5f9d286071e91730852662.png
При разрешении меньше 640 нужно сделать так, чтобы она стала такой: 5f9d2885084cd957935907.png
  • Вопрос задан
  • 184 просмотра
Решения вопроса 1
firedragon
@firedragon
Не джун-мидл-сеньор, а трус-балбес-бывалый.
Делаете медиа селектор и для нужных столбцов делаете дисплай ноне.
Писал с мобильника, так что не совсем то.
Вот ваш случай
https://codepen.io/AllThingsSmitty/pen/MyqmdM
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
zkrvndm
@zkrvndm
Архитектор решений
Используйте медиазпросы и псевдоэлементы. Посмотрите пример с одного из моих сайтов:
https://imgural.ru/product/lpu
Докрутите до таблицы и попробуйте уменьшить ширину окна.
Ответ написан
Комментировать
ledperm
@ledperm
Добрейшей души человек!
Собственно, одним из действенных вариантов — создание горизонтальной прокрутки у таблицы.
Я нашел один интересный подход к адаптивности таблицы. Он заключается в использовании data-атрибутов и псевдоклассов.
Пример можно посмотреть на странице моего сайта https://cerbergroup.ru/dlya-biznesa/videomonitoring.php
Внизу страницы есть таблица. попробуйте уменьшить ширину окна. Надеюсь вам этот вариант понравится.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы