CSS, растягивание блока в высоту

[strobik]

Суть следующая:

есть один большой блок, содержащий два других: один слева, другой справа.

большой блок содержит ТОЛЬКО другие блоки и больше ничего.

а вот левый и правый внутренние блоки содержат текст. причём, на каждой странице сайта - кол-во текста разное.

задача:

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

а самое главное: чтобы другой внутренний блок имел такую же высоту!

проще говоря: высота ВСЕХ трёх блоков должна быть РАВНА и зависеть от высоты самого большого из внутренних!

Проблема в том, что если большому блоку задать фиксированную высоту в пикселях, то внутренним можно поставить по 100% и всё работает.

а если большому блоку фиксированную не ставить (ибо нельзя), то здес пошло-поехали:

* при наполнении левого блока растягивается ТОЛЬКО она. ни правый, ничего больше не двигается

* при наполнении правого блока: растягивается он, большой блок, а левый не шевелится.

Вот мой код HTML:

<div id="main">
    <div id="left">тут текст</div>
    <div id="right">и тут тоже</div>
</div>

А это в CSS:

#main {
    width:800px;
    height:600px; /* но этой строки быть не должно! а без неё не работает! */
}

#left {
    float:left;
    width:300px;
    height:100%;
}

#right {
    margin-left:300px;
    width:500px;
    height:100%;
}

Помогите, пожалуйста, кто чем может!

[strobik]

вот ещё: http://jsfiddle.net/2q5GW/

вот надо чтобы левый блок был равен по высоте правому

Edited April 1, 2012 by strobik

[gordi]

Стандартная эмуляция колонок равной высоты

Смотрим и выбираем

1. http://trifler.ru/layout.htm

2. http://trifler.ru/grail.htm

По ссылка в указанных разделах есть страницы с примерами.

[v01d0s]

http://habrahabr.ru/post/64173/

[strobik]

Спасибо, ребят!

Совместил простое с эффективным: display:table

Кстати, я этим всем делом только начинаю заниматься, и для себя провёл маленький опрос.

Может, флуд, но кому-то будет интересно:

опросил 100 человек, из них IE используют 8,1%

А из всех IE'шников, версией 7 и нижу пользуются 17,9% (т.е. 1,4% из всех)

Это я к тому, что способ display:table писался в 2009 и подобных годах, картина другая была с браузерами.

а я опрос провёл и сделал просто и кроссбраузерно!

работает в IE 8 и выше, FF, opera, хром (т.е. 98,6 % людей будут довольны)

Edited April 2, 2012 by strobik