Making floated div shrink instead of dropping to new line

Is there any way I can force a floated div to shrink instead of going to a new line?

I know I can set implicit widths on the divs but it's on a menu which might have variable amounts of items in it. I'm trying to do this while keeping the site's layout fluid if possible.

#left { float: left; border: 1px solid #000; } #right { float: right; border: 1px solid #000; }

 
This div represents the logo
 
 
 
When the window's width is reduced and these divs touch I want this div to shrink instead of falling to the next line. 
 

Basically, I want #right to begin shrinking when the browser window is shrunk rather than having it drop a line first, then shrink when the window is further resized.