CSS variable child-height depending on parent-height

:)

So the problem is the following:

The red box is the parent-box. The blue box will hold Guestbook-comments. The yellow box will hold the guestbook-formular. Now: The green box will hold a line which should be as long as the blue box is. That means that the height of the green box should be equal to the height of the blue box, but not pre-defined.

I tried using "height:100%", but that didnt work out. It gave me a box as big as my screen is.

Do you have any idea开发者_如何学JAVAs?

Check out Faux Columns, a very common technique used to solve this problem. Essentially, you combine all three backgrounds together into one, and set that image as the background for your containing box. That way, when the containing box grows, so do your inner columns.