Float inside a float (IE bug)

[desheffer]

Hello all, I'm having an issue with (something like) the following:

<div style="background:blue; float:right;">
<div style="background:orange; float:right;">AAA</div>
</div>

In FF, I see none of the blue of box, only the orange 'AAA' box floated to the right, exactly as I expect. In IE, however, the blue box fills the page width 100%. It's as if it has lost its float.

I've been searching for a few hours, and although there are a lot of discussions on IE bugs, I couldn't find one on this particular issue. Any ideas how I can prevent this?

[JKing]

I think this is an issue with how the two browsers choose a width for your outside div. IE seems to be defaulting to a width of 100%. Applying a width to your outer div will fix this issue.