CSS differences in Internet Explorer

With the coming of CSS, the world of web was refreshed and was breathed with a new life. Color, stylized fonts, borders, margins, etc. were used in order to make a web page or site attractive. There are several browsers on which web sites or pages are opened. The web developers had to test their work in different browsers so that everyone has access to their work. Internet Explorer or IE is the most accessed browsers but there are various differences in its 3 versions especially in their support of CSS.

Why designers should have knowledge of CSS differences?

Every site designed for promotion, aims to receive higher search engine rankings. For achieving it they need to apply numerous CSS tips. Here you are provided with some useful points or differences that are present in different versions of IE.

The major differences that are to be found in different versions of Explorer are:

• Selectors & Inheritance
• Property Support
• Significant Bugs and Incompatibilities
• Other Miscellaneous Techniques

Selectors & Inheritance : Selectors are part of CSS techniques that help in optimization and saves on a lot of time. There are numerous kinds of selectors like Child Selectors, Chained Classes, Attribute Selectors, Adjacent Sibling Selectors and General Sibling Selectors. These selectors are supported by one browser and not supported by the other. All these selectors are supported by the latest versions of IE7 and 1E8 and not by IE6.

Property Support : Different properties of CSS like Fixed-Position Elements, Transparent Border Color, Max-Height & Max-Width, Min-Height & Min-Width, Property Value inherit, Border Spacing on Table Cells, Rendering of Empty Cells in Tables, Vertical Position of a Table Caption, Clipping Regions Orphaned and Widowed Text in Printed Pages, Page Breaks Inside Boxes, Outline Properties, Alternative Values for the Display Property and Virtual Dimensions Determined by Position are not supported by all browsers. These properties are responsible for giving a webpage or website a new and appealing appearance. All these are supported by IE7 and IE8 and not by the older version, IE6.

Significant Bugs and Incompatibilities : There are various incompatibilities and bugs in IE6 and IE7 that a web designer must know in order to create a well-designed and optimized site. Bugs in IE6:

• It Doesn't support styling of the element
• Doesn't support IDs and classes that begin with an underscore or hyphen.
• It Offers only fractional support for @font-face
• Dotted borders appear almost identical to dashed borders, etc.

Bugs in IE7:

• List items for a list that is ordered, its layout will not increment their numbers
• Offers only fractional support for @font-face.
• List items don't support all possible values for list-style-type
• List items that have a specified list-style-image will not be able to display the floated image.
• Apart from these many other bugs occur in different situations.

Other Miscellaneous Techniques : The advanced techniques like Media Types for @import, Incrementing of Counter Values and Quote Characters for Generated Content are only supported by IE8.
Knowledge of these differences will help a web site developer in framing a browser friendly site that will be supported by all three versions of Internet Explorer. Our CSS guideline will help your site acquire higher search engine rankings.