Upshrink Problem

[codenaught]

I am making a new theme for SMF but have run into a small problem.

To make it look better I aligned the newsbox and user info headerbodies from top to bottom using CSS: 

.headerbodies
{
   height: 90px;
   overflow: auto;
}

So everything looks all nice and fine. But then I collapse the header, and bring it back. The User Info box suddenly streches across the screen and pushes the Newsbox off the headerarea and forces the user to scroll horizontally. This is simply fixed by reloading the page but it looks really bad to have that happen at all.

What is odd is that this only happens in Firefox. When I tried it on Internet Explorer and Opera I had no problems at all.

To see what exactly happens, go here: http://virtualchill.ath.cx/smf/index.php
and click the upshrink button and then click it again to bring back the header. If it does what it did to me the User Info box will expand greatly in width. Please try this in Firefox as that is the browser that it is doing this to me on.

[[Unknown]]

Try giving the user info box a width (percentage or otherwise.)

-[Unknown]

[codenaught]

Thanks [Unknown]!

That fixed it.

I added a width attribute to the headerbodies class and it stopped streching. 

But there is one more thing that isn't working the way I want.
The class headerbodies I assume means the user info and news box so when I used the height restriction and the overflow: auto I thought it would make it so that either box that had too much content in it would create a scroller but appearntly it only does this for the newsbox. When an avatar is too big it will fall off of the headerarea instead of creating a scrollbar to scroll the rest of it. So what can I do create a scrollbar for the User Info box? Would this part need to be added through index.template without being able to use the stylesheet?

Nevermind, I figured it out for the most part.