Today, IE General Manager Dean Hachamovitch posted a follow-up: HTML5, Hardware Accelerated: First IE9 Platform Preview Available for Developers. Yes, you can now download what Microsoft calls a Platform Preview to test drive Internet Explorer 9 for yourself.

There are also a number of demos to show the improved performance and standards support in IE 9. Judging by several of the demos (HTML5 T-Shirt Designer and SVG-oids are two) it looks like IE9 will finally support XHTML served with the application/xhtml+xml media type. We’ll never know, but I can’t help wondering if the number of people using “real” XHTML would have been greater if Microsoft had implemented support for that earlier.

One of the things that Microsoft claims will be improved in IE9 is type rendering, which I’m looking forward to a lot. To my (admittedly Mac OS X-conditioned) eyes the whole of Windows needs to catch up there.

As Jeffrey Zeldman puts it in IE9 preview:

Thus efforts to catch up to the typographic legibility and beauty of Mac OS X and Webkit browsers are presented, in Dean Hachamovitch’s blog post, as leading-edge innovations.

Type rendering aside, it’s promising to see more information about IE9. Let’s hope Microsoft can live up to what Dean Hachamovitch writes in today’s blog post:

We want the same markup to just work across different browsers. In IE9, we’re doing for the rest of the platform what we did for CSS 2.1 in IE8. IE8 delivered a high-quality CSS 2.1 implementation, sticking to the standard, and looking to other implementations in places where the standard is ambiguous.

I’m still amazed at how few IE8 problems related to CSS 2.1 I have run into. If IE9 can deliver that level of support for HTML5, DOM, CSS3, and SVG… yay!

Makes me wonder how long it will take for IE8 to be phased out.

IE6, IE7, IE8 and IE9 – It’s so crazy!

To rescue the web designers from this aching job of testing browser compatibility in different browsers there are few websites which offer this service. On these websites you can check the compatibility of your website in all desired browsers. You can find these websites below:

Browsershots	Browsershots
Spoon	CrossBrowserTesting
NetRenderer	Litmus
BrowserCam

IETester

In my opinion, each xhtml coder needs software for testing web-pages for various Internet Explorer versions . If you use standard methods and install all IEs, then one cannot guarantee the quality of work of the web-pages.

Here is the tester I have found for myself: IE Tester

IETester is a free Web Browser that allows you to have the rendering and JavaScript engines of IE8, IE7, IE 6 and IE5.5 on Vista and XP, as well as the installed IE in the same process.

But this soft has small bugs.

Known problems and limitations :

• The Previous/Next buttons are not working properly
• Focus is not working properly
• Java applets are not working
• Flash is not working on IE6 instance in user mode : A solution is to launch IETester as admin user and Flash will work.
• CSS Filters are not working correctly in user mode : A solution is to launch IETester as admin user and CSS Filters will work.
• PNG transparent do not work correctly.

PS: those who are interested in this information, please contact me, as I have got a portable version IE7 and IE8, which work with any Windows without installation and even using it from your flash.

• Problems setting Google Chrome as the default browser on Windows Vista
• Blank entries can appear in the address bar’s list of suggestions.
• Adding DigiNotar and SwissSign Gold as trusted certificate authorities for extended validation (EV) SSL certifciates.
• Fix a problem with logging statistics.
• Prevent Javascript from accessing HTTP-only cookies.
• Add a histogram to track how Google Chrome was launched.
• A tab crash when dates are set past Y3000.
• Block reading unauthenticated bytes from the proxy when the user cancels a 407 proxy auth request.
• Add SwissSign Gold CA as a trusted CA for extended validation (EV) certificates.
• Add DigiNotar as a trusted CA for EV certificates.

Read more here.

But for some reasons, sometimes this script does not work correctly on my server . I really don’t understand why.

So, I use next solution to solve the problem.

Let’s look at the next example.

Save this code to your style-ie.css file:

1
2
3
4
5
6
7
8

#logo{
	behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
	this.src = "blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
	this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
	);
}

Important! You need to create transparent image and save it as blank.gif to same folder where style-ie.css. is saved. You can make blank.gif 1px to 1px.

This code will work for IMG tag and for CSS background style.

But if you use background and repeat method, you need to create a new style for repeated backgrounds.

For example:

1
2
3
4
5
6
7
8

#header{
	behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
	this.src = "blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='scale')",
	this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
	);
}

The code is the same as above for #logo, I changed only this part

1

sizingMethod='crop'

to

1

sizingMethod='scale'

And the last important thing – #header must to have width value in CSS file.

For example:

1
2
3

#header{
	width:100px;
}

Or

1
2
3

#header{
	width:100%;
}

You could download an example here.

By the way, please,  read this post to know how to use PNG transparently without Javascript in IE6

Thanks.