How can I make my span properly aligned as I toggle another element?
===

In this [jsfiddle][1], I am trying to create a DIV that expands and collapses as you click its title.  The title is positioned on the top border, almost like a legend tag of a fieldform.  I would like for the top border of the DIV to remain when the box is collapsed.

If you check out my jsfiddle, you'll see it functions pretty well.  However, the border of my container box must be turned off in order to achieve this effect.  As a result, the contents of my title shift to the left.  They are shifting the same amount of pixels that the left border of the outer DIV was in width.

I've tried a few things to compensate for the shift because I would like for the text to remain in the same position while the top border remains in its original position as well, but no luck so far.  Does anyone have any ideas?

  [1]: http://jsfiddle.net/ZRWBA/