September 10, 2008 at 11:59IE8: CSS Changes, Details for Developers
In the eighth version of Internet Explorer, a lot of changes are expected, there are also those that relate to CSS. A good developer should try to know about the capabilities of various browsers, so I consider the css-nuances of the new IE interesting. The article “Microsoft CSS Vendor Extensions” appeared on the official internet explorer developers blog , which describes the css changes in sufficient detail.
Below under the cut, I provided basic information on changes and innovations.
First of all, it is necessary to tell that Microsoft has changed the naming order of some css properties. Now all "non-standard properties" get the prefix "-ms-". In order to fully comply with css 2.1 in IE 8, such a prefix received properties suitable for the following conditions:
Here is a list of properties that received the prefix "-ms-" (indicating the reason):
Developers understand that for many sites they will have to translate the old values to new ones, so the old values, although they will be considered obsolete, will be supported in the eighth version for compatibility. When developing new code for IE 8, only the new naming conventions should be used.
Changes affected a property like filter. Previously, unfortunately, the filter syntax did not match CSS 2.1. For example, in the indicated code, commas were considered invalid.
In the new version of the browser, the filter syntax is aligned with the CSS specification:
it is easy to notice that in the new syntax the value of the property is quoted.
Below under the cut, I provided basic information on changes and innovations.
First of all, it is necessary to tell that Microsoft has changed the naming order of some css properties. Now all "non-standard properties" get the prefix "-ms-". In order to fully comply with css 2.1 in IE 8, such a prefix received properties suitable for the following conditions:
- if the property is a Microsoft extension (not defined in the specification or CSS module);
- if the property is part of a CSS specification or module that has not received the Candidate Recommendation status from the W3C;
- if the property only partially implements the property defined in the CSS specification.
Here is a list of properties that received the prefix "-ms-" (indicating the reason):
| Property | Type | W3c status |
| -ms- accelerator | Extension | |
| -ms- background-position-x | CSS3 | Working draft |
| -ms- background-position-y | CSS3 | Working draft |
| -ms- behavior | Extension | |
| -ms- block-progression | CSS3 | Editor's draft |
| -ms- filter | Extension | |
| -ms- ime-mode | Extension | |
| -ms- layout-grid | CSS3 | Editor's draft |
| -ms- layout-grid-char | CSS3 | Editor's draft |
| -ms- layout-grid-line | CSS3 | Editor's draft |
| -ms- layout-grid-mode | CSS3 | Editor's draft |
| -ms- layout-grid-type | CSS3 | Editor's draft |
| -ms- line-break | CSS3 | Working draft |
| -ms- line-grid-mode | CSS3 | Editor's draft |
| -ms- interpolation-mode | Extension | |
| -ms- overflow-x | CSS3 | Working draft |
| -ms- overflow-y | CSS3 | Working draft |
| -ms- scrollbar-3dlight-color | Extension | |
| -ms- scrollbar-arrow-color | Extension | |
| -ms- scrollbar-base-color | Extension | |
| -ms- scrollbar-darkshadow-color | Extension | |
| -ms- scrollbar-face-color | Extension | |
| -ms- scrollbar-highlight-color | Extension | |
| -ms- scrollbar-shadow-color | Extension | |
| -ms- scrollbar-track-color | Extension | |
| -ms- text-align-last | CSS3 | Working draft |
| -ms- text-autospace | CSS3 | Working draft |
| -ms- text-justify | CSS3 | Working draft |
| -ms- text-kashida-space | CSS3 | Working draft |
| -ms- text-overflow | CSS3 | Working draft |
| -ms- text-underline-position | Extension | |
| -ms- word-break | CSS3 | Working draft |
| -ms- word-wrap | CSS3 | Working draft |
| -ms- writing-mode | CSS3 | Editor's draft |
| -ms- zoom | Extension |
Developers understand that for many sites they will have to translate the old values to new ones, so the old values, although they will be considered obsolete, will be supported in the eighth version for compatibility. When developing new code for IE 8, only the new naming conventions should be used.
Filter property
Changes affected a property like filter. Previously, unfortunately, the filter syntax did not match CSS 2.1. For example, in the indicated code, commas were considered invalid.
filter: progid: DXImageTransform.Microsoft.Alpha (Opacity = 80, FinishOpacity = 70, Style = 2);
In the new version of the browser, the filter syntax is aligned with the CSS specification:
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha (Opacity = 80, FinishOpacity = 70, Style = 2)";
it is easy to notice that in the new syntax the value of the property is quoted.