I have hidden div that I toggle Show and Hide with another div. On “Show” I animate the height of the hidden div up to auto, and when I toggle “Hide”, it goes back down to zero. Standard stuff.
Here is the problem:
The hidden div contains text blocks that I want to appear as columns, so I set their class to Float Left.
When I do this, everything underneath the hidden div jerks immediately down to the new height—the nice, fluid animation breaks. I remove the float-left attribute and the animation appears fine, although now the text block do no appear as columns.
Here are the two examples:
Text Blocks w/ float-left, animation broken:
Text blocks w/o float-left, animation is ok, but the text is no longer in columns:
Anyone know how to make the text blocks appear as columns AND animation appear fine?
Thank you in advance!