Как реализовать четыре колонки одинаковой резиновой высоты?

Table получится без отступов между колонками.

Да с чего бы, что мешает представить отступы в виде ячеек таблицы, пустых, с прозрачным фоном?

@IonDen а не изобретение-ли это велосипеда, ладно всё равно через пару часов отмечу это как решение тоже.

@ixon Изобретение велосипеда?)) Да мы так еще 10 лет назад верстали)

а что мешает представить отступы между ячейками с помощью падинга? а внутри для фона использовать див-врапер контента?

Вариант в таблицей самый лучший в данном случае. Это можно сделать и с дивами, но их будет много и большая вложенность.

таблицу не получится сделать адаптивной, а блоки (дивы) можно расположить 2х2, а не 4х1.

@lexxpavlov "таблицу не получится сделать адаптивной, " width у таблицы и у ячеек можно указывать в %

@begemot_nn понятно, что ширину ячеек можно сделать резиновой, но не от этого ячейки не станут адаптивными. Часть ячеек таблицы нельзя переместить на другую строку: вот так

@lexxpavlov полностью согласен. так как на рисунке с таблицей поступить нельзя.

@begemot_nn что я и отметил в своём комментарии. А, судя по картинке из вопроса, автору может понадобиться такая возможность адаптивности.

@lexxpavlov вы видимо много проектируете интерфейсы, (никакой иронии) раз по картинке смогли определить, что автору потребуется адаптивность (в смысле - выстраивание этих блоков вертикально, при малой ширине экрана у просматривающего) но при вертикальном расположении блока - ни к чему следить за их высотой. одинаковая высота явно нужна, чтобы между этими колонками и общим футером не было некрасивых зубов :)

@begemot_nn сегодня ему не надо, а завтра может понадобиться. Я же не утверждаю. В своём первом комментарии я всего лишь отметил этот факт, чтобы автор вопроса мог иметь это в виду. Я не сторонник использования таблиц в верстке, особенно в тех случаях, когда можно обойтись (см. соседние ответы). Но если автор вопроса решит использовать их - пожалуйста. Я всего лишь поделился своим опытом по этому поводу, и не собирался развивать эту тему.

@lexxpavlov и я с вами полностью согласен. я с некоторых пор тоже стараюсь не использовать таблицы для "нетабличных данных". но иногда, это так успокаивает нервы :)

Совсем не то

Да уже вижу, невнимательно условие прочел..

htmlbook.ru/blog/div-nye-kolonki-odinakovoy-vysoty...

@vdem тоже самое что и таблицей, просто дивам задаем стили table-cell и т.п.

использование у div display: table - это решение для случая "делай что угодно, но сверстай дивами а не таблицами" :)

Во первых: Зачем верстать не табличные данные таблицами?
Во вторых: Как вы сделаете отступы только справа и слева у ячеек таблицы?
В третьих: Верстка таблицами по объему будет больше и сложнее в поддержке
В четвертых: Верстка таблицами на данный момент не актуальна

У вас есть что мне возразить по вышеперечисленному?
И посмотрите на код, там только один div - обвертка, а внутри маркированный список. Так будет семантически более правильно, чем все запихивать в таблицу.

@Golumenov Видите ли, я не хочу вступать с вами в спор, я уважаю ваш опыт.
Я согласен с вашими утверждениями кроме, пожалуй того, что верстать маркированным списком явно колоночные данные - это нифига не "более семантично".
Меня вообще пугает современная тенденция верстать все списками..

@begemot_nn да можно сверстать чем угодно, списками, дивами, спанами или тем. что больше подходит с точки зрения семантики, но только на сегодня, так уж устоялось, что в таблицах должны быть ТОЛЬКО табличные данные (например таблица удельной тепло-проводимости в зависимости от среды). Использовать таблицы для оформительских целей сегодня считается дурным тоном и каменным веком web-а

@Golumenov воу-воу, полегче. Раз уж раскидываетесь определениями — будьте добры пояснить, с чего Вы взяли, что перед нами не табличные данные? )

@iiil А с чего вы взяли, что это табличные данные? В вопросе нигде таблицы не упоминаются.
Ну, а если все-таки таблица, то можно сверстать так: codepen.io/golumenov/pen/nEbrL
Используются прозрачные border-ы

Андрей Голуменов: не путайте табличную разметку с имитированием ее в css

говносовет, и говновремена прошли, семантику нужно учитывать, есть css представление таблиц, тафиг в разметку тулить таблицу?