Как правильно сделать адаптивной табличную верстку?

Question

[ravlex]

Собственно есть сайт с табличной версткой, нужно сделать его адаптивным. Если с блочной структурой мне понятен принцип (max-width и проценты), то в табличной верстке - нет. Как лучше поступить?

Comments

[ArturArturov]

код в студию

Answer 1

[fraky]

Flexbox? или там приципиально нужно таблицами, чтобы даже в IE7 пошло?

Answer 2

[Максим Тимофеев]

Если Верстка табличная, то вся адаптация упирается в width таблиц в %
Но вот сделать на малых экранах например 3 ячейки в ширину, а на больших 6 - не получится без адских костылей.
Все зависит от сайта. Дайте ссылку. если там все таблицами - то лучше переверстать дивами, можно часть.

Comments

[ravlex]

Вот сайт www.psycholog-sos.ru/test.html

[Максим Тимофеев]

ravlex: Сайт в принципе ужасен, поэтому надо его переверстать и доработать хотя бы местами. Это же жесть текст картинкой. Сделать это адаптивным только через css не вариант.

[Максим Тимофеев]

ravlex: Кнопки вырублены топором. Это надо оставить как есть или полностью переделать. Переживать, что не особо смотрится на мобилках не стоит, когда он ужасно смотрится везде.

[Сергей delphinpro]

>> Переживать, что не особо смотрится на мобилках не стоит, когда он ужасно смотрится везде.
+++ :D:D:D

[ravlex]

Да, сайт ужасен, но нужно чтобы он так же ужасно был и на мобилках )

[ravlex]

В общем нужно сделать то, что есть, адаптивным. Грубо говоря сложить блоки. Не пойму как задавать ширину в % и сделать адаптивными картинки.

[Максим Тимофеев]

ravlex: как костыль - display: block;

Answer 3

[Максим Васильев]

Я бы заюзал bootstrap.
Но там тольько до 12 ячеек в строке.

Comments

[Максим Тимофеев]

Я бы тоже

[AlikDex]

Но там тольько до 12 ячеек в строке.

а вот и не правда. в каждой ячейке можно сделать еще 12 вложенных ;)

Answer 4

[HamSter]

еще как вариант

Answer 5

[Андрей Никифоров]

zualex.github.io/frontend-template держи