meyerweb.com

So IE7 beta 2 is out. As you might expect in a beta, it has some things that don’t work as one might hope, whether due to long-standing behaviors or brand new bugs.

I’ve said it before, and I’ll say it again: don’t panic. Trying to fix a site that’s “broken” in IE7b2 is kind of like deciding to raze your profitable gas station just because you heard car companies are experimenting with hydrogen fuel cells. When the final version of IE7 comes out, then you can worry about what to do. Maybe your site won’t be “broken” any more, and you won’t have to do anything.

In the meantime, what you should do is figure out what’s causing the problem you’re seeing in b2, create a very minimal test case that causes the problem, and submit that to Microsoft. By doing that, you give them a chance to identify the problem and fix it before IE7 goes final… at which time, you won’t have to do anything about your site, because it won’t be broken.

That’s if they fix the bug in question. They might not; they don’t have infinite time and energy. But I can absolutely guarantee that they’ll never get around to fixing a bug nobody told them about.

In the CSS world, there are some points of concern, including bugs that are new to IE7b2. The css-discuss community has started collecting information over on the wiki, and if you have test cases that demonstrate CSS bugs in IE7, you should feel free to add information and links to that page.

Before you do, though, make sure to observe the following (adapted from my post to css-discuss):

1. Make absolutely certain you’re testing IE7 beta 2. IE7b1, which is available for download on various sites, had no known CSS enhancements. It did not support CSS2.1 selectors, or fix any bugs on which CSS hacks depend, or just about anything else. If you test with IE7b1, you’re wasting your time. Again, be SURE you’re testing with IE7b2.

2. If you’re testing property, value, or behavioral support in IE7, make absolutely certain that your test case uses no hacks, filters, conditional comments, or other measures. If you’re testing float margin-doubling, for example, but you still have in a CSS hack targeted at IE6, you might get completely spurious results. Make your tests as simple as humanly possible while still showing the problem.

3. If you’re testing support for hacks, filters, or conditional comments in IE7, try to make sure you’re testing using simple effects. For example, here’s how I’d test for IE7 support of a child combinator:

      p {color: red; font-style: italic; font-weight: normal;
         text-transform: none;}
      div>p {color: green;}
      div > p {font-style: normal;}
      #test>p {font-weight: bold;}
      #test > p {text-transform: uppercase;}
   
      <div id="test"><p>Bold uppercase green</p></div>
      <p>Italic normal case red</p>
   

   This approach uses property/value combinations that we all know IE/Win has supported for a long, long time. If I tried to test with widths and margins and padding, I’d be concerned that a box model bug was sneaking in and making me think there was a selection bug. With the color-font-text approach, this is far less likely. (Not non-zero, but close.)

   Similarly, to test arbitrary-element hover, I’d do nothing more exciting than:

       p:hover {color: green; background: cyan;}
   

4. If you find a new bug, as Al Sparber has with the a:hover/@import problem, absolutely document it with a basic test case (as Al did) and feel free to ask others for confirmation. But remember the previous points when you construct your test case.

The goal of all this isn’t just to make sure Microsoft knows about every CSS bug under the sun, though that certainly wouldn’t hurt. What I also hope to see happen is that we get an idea of what’s new, what’s broken, and what absolutely must be fixed. To pick a hypothetical example, suppose it was discovered that in fixing float margin-doubling, IE7 broke clearing behavior. That would absolutely have to get fixed before IE7 final. Doing so would be far more critical than, say, adding support for generated content, or even fixed positioning.

Again, don’t panic, but please do help find any bugs or other problems in IE7b2, so that we have a chance of seeing the problems corrected.

Addenda: so just after I posted this, I found out about the IEblog post What’s New for CSS in Beta 2 Preview? and the in-progress MSDN technical note Cascading Style Sheet Compatibility in Internet Explorer 7. Those might come in handy as a baseline of “here’s what I should see” while you work to find out what you actually see.