Two div overlapping with variable height = without height on container

Question

It is quite easy to make two div overlap when the size of the container div is known but what if the div heigh cannot ?

I tried to do it without manipulating container height: http://jsfiddle.net/AJfAV/ But #text2 go over #text3 and do not "push" it. How can the #container be resized automatically ?

I manage to achieve my goal using jquery ui but I feel this is not an elegant solution: http://jsfiddle.net/AJfAV/6/

Answer 1

Is this what you need?

Updated fiddle:

I'm setting height to the default, auto, using jQuery, like this:

$("#container").css("height", "auto");

You can also set: height: auto; in CSS.