Заполнить родителей, установив процент роста детей ⇐ CSS

[Anonymous]

У меня есть 2 столбца. Первый столбец выше. Второй столбец имеет 3 поля. Я хотел бы заполнить второй столбец, установив процент роста детей, но это не работает. Вторая высота столбца должна равняться высоте первой колонны. Как это сделать?

Код: Выделить всё

#container {
overflow: auto;
}

#firstColumn {
float: left;
background-color: yellow;
}

#secondColumn {
float: left;
background-color: gray;
}

#first {
height: 10%;
}

#second {
height: 40%;
}

#third {
height: 50%;
}< /code>


CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT


TEST1
Content


TEST2
Content


TEST3
Content


< /code>
< /div>
< /div>
< /p>
Обновление: < /p>
Я попытался установить родительскую высоту, но третий поля вышел из второго колюта. class = "Snippet">

#container {
overflow: auto;
height: 300px;
}

#firstColumn {
float: left;
background-color: yellow;
height: 100%;
}

#secondColumn {
float: left;
background-color: gray;
height: 100%;
}

#first {
height: 40%;
}

#second {
height: 10%;
}

#third {
height: 50%;
}< /code>


CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT

CONTENT


TEST1
Content


TEST2
Content


TEST3
Content

Подробнее здесь: https://stackoverflow.com/questions/218 ... percentage