Может ли Grid заменить таблицу?
Собственно сам вопрос: могут ли гриды заменить таблицу? А нужно ли?
Мне никогда не нравились таблицы, не знаю чем. При появлении гридов, хочется многое сделать ими. Захотел сделать простую табличку, но блоки внутри обвертки сами по себе, то есть по сути нельзя сделать колонку одинаковой ширины по контенту, ну точнее можно, но это будет фиксированная высота для других колонок. Как я понимаю, subgrid решил бы эту проблему, но поддержка только в FF.
Какие есть способы реализовать таблицу гридами, чтобы:
- можно было подсветить строку при ховере;
- колонки бы растягивались по максимальному контенту в колонке, но могли иметь максимальную ширину;
Стоит ли вообще это делать с помощью Grid? Правильнее ли это делать по прежнему через Table и по сути не изобретать велосипед?
Ответы (1 шт):
Может ли CSS Grid заменить
<table>
Может только визуально, но не семантически.
Поэтому, общий ответ - нет, полноценно заменить не может (скорее, является альтернативой в исключительных случаях).
Правильнее ли это делать по прежнему через Table и по сути не изобретать велосипед?
Когда правила определены соблюдением семантики документа, a11y, SEO, и естественной логикой вещей - да, правильнее.
Стоит ли вообще это делать с помощью Grid?
Это зависит от условий/требований каждой конкретной задачи, и личных мнений/предпочтений. По сути, нетехнический вопрос.
Строго говоря, правил в проф. верстке не существует - т.к. сам термин "правило" подразумевает формализацию хорошей методики и следование ей... но на практике, довольно часто прибегают к плохим/спорным методикам: из-за технических ограничений, и/или желаний постановщика задачи, и/или банально малого уровня подготовки (сказывается низкий порог вхождения в веб-технологии).
Еще, надо учитывать устойчивость причин которые приводят к такому результату. В первую очередь, это наследие истории веба. Вот к примеру, есть множество людей использующих float для лэйаута страницы, и в их среде это считается вполне правильной, нормальной практикой (несмотря на противостоящую норму другого множества людей, применяющих флексбоксы). То же самое с "десктоп-ферст/мобайл-ферст", "px/(r)em", "уникальность/специфичность селекторов", и так далее. Пока старое работает - оно будет находить сторонников.
Поэтому, в верстке, вопросы "что считать правильным" - это вопросы точки зрения. Они помогают найти единомышленников, но не правду. Рекомендую каждый предмет таких вопросов изучать всесторонне и полностью, а затем самостоятельно делать выводы рассудком (к чужим мнениям прислушиваясь, но не полагаясь на них).
Какие есть способы реализовать таблицу гридами, чтобы:
- можно было подсветить строку при ховере;
- колонки бы растягивались по максимальному контенту в колонке, но могли иметь максимальную ширину;
Следуя правилам stackoverflow (которые действуют, в отличие от правил верстки ?), эти вопросы следует задать отдельно - т.к. в них как минимум 2 отдельные самостоятельные задачи.