IE7
From CSS Discuss
IE7 bug database
Internet Explorer Feedback [1] is a bug reporting system (FAQ at IE blog [2]). The site is closed.
IE7 beta, 'release candidate' builds and final release
Help | About Internet Explorer -> Version
| build | date |
|---|---|
| 7.0.5296.0 | Jan31 |
| 7.0.5335.5 | Mar20 |
| 7.0.5346.0 | Apr25 |
| 7.0.5450.4 | Jun29 |
| 7.0.5700.6 | Aug24 |
Final version was released on 18 October 2006.
Wikipedia's release history [3]
CSS Bugs
- Position Is Everything's list of Internet Explorer bugs [4]
CSS Filters and Hacks
- *+html hack - targets just IE7 [5]
- *|html hack - excludes IE7 and IE6 [6]
- Fuzzy specificity + CSS3 selector hack [7]
- Comment as extra space to break selector (eg. p/**/#t2) [8]
- The "Triple-X CSS hack" exclusively for targeting IE7 [9] (NB. also affects iCab 3)
- Dithered.com's list of CSS filters (no longer available at original site -- see the Internet Archive instead [10])
Conditional Comments
- Version Vector : According to Microsoft, IE7 Beta 2 expects a conditional comment of [if IE 7.0b]. Therefore, it's probably better to use [if lte IE 6] for targetting IE6 and lower. The release candidate (and the final version) are targetted by [if IE 7.0]
List-item whitespace bug has been fixed in RC1 (release candidate version)
- This old bug is still around in Beta 2. (along with absolute positioning bugs on the left nav...) (hmmm - seems fixed in the final release but maybe I'm just not seeing what the problem is supposed to be?)
- I posted a test case and workaround on this. The trick is to set widths to the elements displayed as blocks.[11]
- The bug seems fixed in RC1.
The @import rule
- 3 Level Nested Import Statement Restriction IE [12]
- @import stylesheet driven sites have no a:hover. This bug is in the beta2 preview, but has already been fixed by Microsoft: "people reported that :hover would not work from an @import. That's a bug and already fixed in our builds." --Markus [MSFT] ([13]). Can be resolved in the beta by embedding #fubar a:hover {float: inherit;} in the head of the affected documents [14].
Fuzzy Specificity Bug
The fuzzy specificity bug that affects IE and Opera 7.54 and under, documented here [15], is still present in IE7 final release.
CSS Properties
background
- the origin of the background, background-position: 0 0; refers to the padding edge or on the border edge, depending on the Has Layout status of the element [16]
- background images get lost on multi line inline links (old problem) [17]
border
- CSS 'transparent' border color still not supported; border colors set to 'transparent' are rendered instead as the font color (default is black) in IE7 [18] *** fixed in the beta release of 24 April 2006, version 7.0.5346.5 ***
display
- It has been stated that the 'table*' values of the 'display' declaration will *not* be supported. (old problem) [19]
float
- Elements with assigned height correctly allow floats to stick out of them, but the protruding part is ignored by the following boxes (new Jan31, Mar20) [20]
- problem with float + clear on the same element (old, Mar20) [21]
- The peek-a-boo problem [22] has been corrected, but there are still simple combinations of essaytext with floats and clears that give peek-a-boo like effects (old) [23]
line-height and vertical-align
- The "line-height/replaced element bug" [24] has been corrected, but when line-heigth is not "normal" then vertical-align doesn't work correctly [25]
min-height, max-height, min-width, max-width
Fixed in Mar20: Is now supported. Works generally well, and does add Has Layout .
position: relative / absolute / fixed
- a.p. box and lost next margin (old, Jun29) [26]
- a.p. element with auto offset following a float: wrong static position (old, Jun29) [27]
- disappearing absolutely positioned divs next to floats (old, Jun29) [28]
- rtl context: bad rendering of relatively positioned inline box (old, Jun29) [29]
- Negative top value on position:relative is deducted from border-width of relative positioned ancestor [30]
Fixed in Jun29:
- position: fixed and absolute fail to shrink-wrap if a child Has Layout , i.e. ul has position: fixed and li has max-width (Mar20) [31]. But when a shrink-wrapping container (because of position: absolute/fixed, or float: left/right) has more children, the ones with hasLayout seem to separately shrink-wrap their content, which is wrong (new) [32]
Fixed in Mar20:
- horizontal scrollbar due to position: relative on non-layout element (new in IE7b2) [33]
- a.p. elements (in standards mode pages) have box model problems, causing content to overflow when not necessary (new) [34], [35]
- a.p. element and wrong relation of percentage width (old) [36]
Fixed in Aug24:
- absolute positioning inside a relative element needs ' Has Layout ' on the r.p. ancestor to establish a containing block (old) [37]. The problem has been fixed in RC1.
z-index
- z-index on a.p. elements within r.p. parents results in wrong stacking. Any r.p. element that Has Layout establishes a new stacking context (old, Mar20) [38], [39]
Selectors
Basic Selector Support Tests
These are intended to check whether basic CSS2.1 selector support is present in IE7.
| spec | link | IE7b2 |
|---|---|---|
| 5.2 | Selector Syntax | PASS |
| 5.2.1 | Grouping | PASS |
| 5.3 | Universal Selector | PASS |
| 5.4 | Type Selectors | PASS |
| 5.5 | Descendant Selectors | PASS |
| 5.6 | Child Selectors | PASS |
| 5.7 | Adjacent Sibling Selectors | PASS |
| 5.8.1 | Attribute Selectors | PASS (notes 1 & 5) |
| 5.8.3 | Class Selectors | PASS |
| 5.9 | ID Selectors | PASS |
| 5.10 | Pseudo-Class Combinations | PASS (note 2) |
| 5.11.1 | :first-child | PASS |
| 5.11.2 | :link and :visited | PASS |
| 5.11.3 | :active, :hover, and :focus | FAIL (note 3) |
| 5.11.4 | :lang | FAIL |
| 5.12.1 | :first-line | FAIL (note 4) |
| 5.12.2 | :first-letter | PASS |
| 5.12.3 | :before and :after | FAIL |
| 6.2.1 | inherit | FAIL |
note 1: Almost every test passes; the only exception is the one that tests two attribute selectors being applied at the same time.
note 2: The only part that fails is: active, which IE7 doesn't support.
note 3: Passes :hover; fails :focus and :active. And did anyone notice that IE styles :focus as if it were :active?
note 4: Fails the list item first line test; passes everything else.
note 5: The button[value] selector doesn't work. When value is given a value (e.g. button[value="edit"]) it can make IE7 to close the window without warning
IE7 Compatibility List Support Test
Kelly found:
According to my tests on the selectors, IE7b2 supports:
- > (Child)
- + (Direct Adjacent Sibling)
- ~ (Indirect Adjacent Sibling)
- [attr] (Basic Attribute)
- [attr="value"] (Attribute/Value [sort of])
- [attr~="value"] (Attribute/Spaced Values)
- [attr|="value"] (Attribute/Hyphen-Sep Values)
- [attr*="value"] (Attribute Substring Selector)
- [attr^="value"] (Attribute Starting String Selector)
- [attr$="value"] (Attribute Ending String Selector)
- :hover
- :first-child
It doesn't support:
- :focus
- :active
- :lang
- Any CSS3 selector other than mentioned above.
Note that when I say "supports" and "doesn't support", I mean when compared to IE6. So what is supported in IE6 should be supported here (I haven't tested things like :first-line and :first-letter, though).
Also, form elements seem to show strange bugs with the selectors. Need more research on this.
(Kelly: I used Dean Edwards IE7 compatibility list to test these selectors. Obviously, the Javascript library was off.)
pseudo-classes, pseudo-elements
- updated testcases: pseudo classes and elements
Microsoft links
- ie blog - priorities 29 Jul 2005: "Standards and CSS in IE"
- ie blog - new in b2 02 Feb 2006: "What’s New for CSS in Beta 2 Preview?"
- ie blog - new details 2 Aug 2006: "Details on our CSS changes for IE7"
- MSDN Library Article 31 Jan 2006, updated 26 Sept 2006: "CSS Compatibility in Internet Explorer 7"
