IE7 Float Bug on Positioned Parent in Standards Mode?

This one’s just for the CSS gurus out there. I have a serious IE7 (Beta 3) problem and I’m stumped. In a nutshell, it seems like there is a bug in IE7 whereby in standards mode float left on a child element does not work if the parent is positioned. It seems like the parent inherits the width of the window, not the width of the window minus its left offset or padding.

Here’s what the code looks like (minus any DOCTYPE stuff):

<body style="">
<div style="border: 1px solid black; position: absolute; left: 250px;">c
<div style="border: 1px solid black; width: 300px; float: left;">Left</div>
<div style="border: 1px solid black; width: 300px; float: left;">Right</div>
<div style=""></div>

Here are the examples:

Standards Mode Example (using DOCTYPE)

Open the above link in IE7. If you size to 1024 width or above, everything is great. But watch what happens when you incrementally resize down. Instead of floating downward, the right side div scrolls off to the right until you reduce the window size to a width smaller than the width of the two divs combined.

In all other browsers this works fine. There is no special CSS involved, no box model hack, nothing like that. This occurs with any DOCTYPE I’ve tried (XHTML, DHTML, strict, loose, transitional). This makes sense, I guess, since any of these DOCTYPEs should keep IE7 in standards mode.

However, if you force IE7 into quirks mode, everything is fine:

Quirks Mode Example (DOCTYPE omitted)

The only difference in the above link is that the DOCTYPE and xmlns attributes have been omitted. As I understand it, this makes IE7 operate in “quirks mode.” But why does this very simple layout require quirks mode? And if it’s non-standard, why does it work in Firefox?

I know, the simple solution would be to run quirks mode by omitting the DOCTYPE. But I can’t. Why? Well, here’s the irony, this project is for a certain software giant, which I won’t name, but they have a product with the initials I.E.

If you can offer any suggestions, please post a comment. Thanks!

More Fun with RegEx

I happened to type the phrase “rebus caneebus” into Amazon A9 today, which is strange enough in itself, but what’s even stranger is that A9 seems to think this could possibly be a USPS tracking code.

a9 search for rebus caneebus

That’s kind of funny, if broken. It turns out that A9 sees alphanumeric strings containing exactly 13 letters or numbers and ending in “us” as a USPS tracking code!

So, for example, Doctor Faustus reads the Berlin papyrus and awaits the delivery of his bubble nucleus, the temperature falls one degree celcius, and in the continental US, where most of us play with pull down menus, A9 and the USPS track the whole thing!