Microsoft Internet Explorer

More than 85% of the world uses Internet Explorer to browse the Internet, but very few people know of how out of date IE actually is. This page is meant to display, or should I say NOT display, how IE handles advanced HTML and CSS that should be supported by all of todays web browsers.

Our first experiment is to see how IE handles an unordered list with leading zeros. If you are viewing this page with IE, you'll notice that there will be no leading zeros in the list below. Instead, IE should display the list with the default bullet format. Upon execution of this page in IE, I've noticed that this is not the case. IE is displaying the list as if it has a list style type of "none" added to it. There is no CSS property added to this list to cause that to happen. This is one of IE's random errors that all web designers hate with a passion. Rather than trying to fix this problem, I left it in to display even more of IE's problems.

• List item number one
• List item number two
• List item number three

Now all you IE fanboys are probably saying, "So what? IE doesn't display one list style. Who cares?" Well guess what? Here's another list format IE doesn't support. The following list should have lower greek letters. IE treates this list the same as the previous one.

• List item number one
• List item number two
• List item number three

Getting nervous yet? Here's another property that IE doesn't support. The following sentence should be surrounded in quotes. If you are viewing this page with IE, you will not see these quotes due to the lack of support for this property.

This sentence should have quotes at the begining and end.

Lets now take a look at how IE handles a single pixeled dotted border. If you are viewing this page with IE, the following element, for what ever reason, will have a single pixeled dashed border.

The next experiment displays IE's incapability to handle an advanced CSS method of assigning properties to elements with certain attributes. The following is a text input box that should have white text and a black background. IE will display the default properties.

Here is yet another advanced CSS method that IE does not support called a child selector. The following text should be bold and blue when viewed in a browser that supports these child selectors.

Yet another advanced CSS method IE does not support is the adjacent selector. The following should have their respective colors based on name.

• Red
• Orange
• Yellow
• Green
• Blue
• Violet

IE only supports hover on the anchor tags, but hover can be applied to any HTML element. This could've been useful for making pure CSS drop down menus, but thanks to IE it can't.

At least IE supports hover on one HTML tag, right? Unlike focus which it does not support at all. The textarea below should become yellow after you click on it.

Nope it's not over yet. We'll now look at how IE handles elements that should have a minimum and maximum height and width. Since IE doesn't support either property, the following element will display as default when viewed through IE.

Lets take a look at how IE handles <abbr> tag. The following text should display a message when you mouse over it.

IE's support for the outline property is rather... non-existent. The text below should be outlined in blue.

Let us now migrate over to IE's ability to handle the border-spacing property when applied to a table. The following table should have no spacing between each border when viewed in any other browser other than IE

Now we will move away from HTML and CSS and into the wonderful world of XML and XSL. These two languages can be very useful when it comes to structuring and formatting data. The following link will lead you to an XML page styled with XSL that should display a basic HTML table.

View this page correctly. Download Mozilla Firefox!