Как сделать 3 блока одинаковой высоты?

Question

[Роман]

3 блока. Я уже пробовал использовать как советуют на хабре с display: table, table-cell и т.д, но ни один вариант не подошел.

В принципе он то подходит, но на половину, пример

но, если например текст мало то высота режется, а мне нужно чтобы она всегда была height: 100%; можно ли такое осуществить?

Т.е. должно выполнятся 2 условия, height: 100%; даже если в блоках очень мало текста и они были одинаковой высоты.

Answer 1

[Therapyx]

Используйте 100vh. Буквально вчера отвечал где-то тут на этот вопрос и переделывал пример.
Если не выйдет. То залейте код на https://jsfiddle.net/ и я поправлю.

Comments

[Роман]

есть, спасибо

[Therapyx]

Роман: значит с первого раза вставили туда, куда надо)) нз.

[Andrew]

Я сомневаюсь, что в IE все нормально будет caniuse.com/#search=vh

[Роман]

Разве много есть пользователей IE <8

[Иван Волков]

< !DOCTYPE html > и в ИЕ6 будет так же как и везде...

Answer 2

[mr-molodoy]

Если можно пренебречь старыми браузерами, Вы легко сможете организовать это с помощью flexbox.

Answer 3

[Иван Волков]

так добавьте к тому варианту что по вашей ссылке, на селектор .container > div { height: 100vh; }

Answer 4

[entermix]

Как Выровнять высоту колонок в bootstrap?