Last year I came across a very odd behavior in Internet Explorer 6 while working on a design: if I ran the cursor over the last link on one page, part of a floated image was cut off. I had no idea what to make of the problem until I read Owen Briggs' description of the “jumping link guillotine bug” when it was mentioned on css-discuss.
I set out to find a solution, but wasn't successful. However, I saw such odd things that I decided to make my tests available to you all—and that's a good number of people, thanks mostly to Mr. Briggs' noticing this little test suite and linking to it.
It seems, from my experimenting, that at least three links, rendered on separate lines and following the floated object in the HTML, must be present for the guillotine bug to be triggered. Hence my test page consists of a list of three links and a floated little photograph of myself despairing over IE's CSS support!
The document type is XHTML 1.0 Strict (since I read that text/html is not a valid MIME type for XHTML 1.1, ahem). The CSS is in the head of each file. Only the a:hover rule differs between files.
| Declarations | Internet Explorer 6 | ||
|---|---|---|---|
| Styling attempted? | Styling correct? | Guillotine bug? | |
{ background-image: url("../cccccc-300x200"); background-position: center; } | Yes | Inapplicable | Yes |
{ background-image: url("../cccccc-1x1"); background-repeat: repeat; } | No | No | |
{ background-image: url("../cccccc-1x1"); background-repeat: repeat; background-position: center; } | Yes | Inapplicable | Yes |
© 2002, 2003 David L. Mitchell.
CSStests@flexHTML.net