The Amazing Bouncing Float
November 11, 2005 2:28 PM Subscribe
Why does IE's rendering of CSS suck so much?
I've been hunting through ask.meta and google and I'm finding a lot on the peek-a-boo bug and the escaping float, but nothing like the issue I actually have. I've used a 'clever' negative-margin trick to have marginalia sit next to some text. Firefox, naturally, displays it just fine. IE, though, displays the text where it would have been without the negative margin (and on top of other text) until you resize the window, even a little, at which point the notes hop right to their proper position. I can't find any other mention of this bug (or better, yet, a fix for it) but I can't be the only one. What gives?
I've been hunting through ask.meta and google and I'm finding a lot on the peek-a-boo bug and the escaping float, but nothing like the issue I actually have. I've used a 'clever' negative-margin trick to have marginalia sit next to some text. Firefox, naturally, displays it just fine. IE, though, displays the text where it would have been without the negative margin (and on top of other text) until you resize the window, even a little, at which point the notes hop right to their proper position. I can't find any other mention of this bug (or better, yet, a fix for it) but I can't be the only one. What gives?
Position is Everything's Explorer Exposed! and IE Primer may help.
posted by kirkaracha at 2:46 PM on November 11, 2005
posted by kirkaracha at 2:46 PM on November 11, 2005
"I've used a 'clever' negative-margin trick"
Is it an IE bug, or more likely, something CSS was not meant to do.
posted by mischief at 3:50 PM on November 11, 2005
Is it an IE bug, or more likely, something CSS was not meant to do.
posted by mischief at 3:50 PM on November 11, 2005
Why does it suck? Mainly because they wrote an implementation years ago, when the CSS spec existed in a vacuum, and then essentially abandoned it. As people starting using CSS in the wild, they found bugs as well as differing implementation details (that are arguably ambiguous in the spec). MS made no effort to resolve these issues, and now here we are.
posted by smackfu at 3:56 PM on November 11, 2005
posted by smackfu at 3:56 PM on November 11, 2005
Negative margins are permitted in the CSS standard. This doesn't mean that what you're using them for is what they're meant to do. :-)
Of course, IE has always been terrible at implementing anything in the CSS standard that's the least bit esoteric. Don't get me started on their DOM. :-)
Why can't you do your layout without the negative margin? What about the "clever trick" is both so cool and so hard to do some other way?
posted by Crosius at 8:49 AM on November 12, 2005
Of course, IE has always been terrible at implementing anything in the CSS standard that's the least bit esoteric. Don't get me started on their DOM. :-)
Why can't you do your layout without the negative margin? What about the "clever trick" is both so cool and so hard to do some other way?
posted by Crosius at 8:49 AM on November 12, 2005
This might help:
Dean Edward's javascript for making IE compliant. Good luck!
posted by chocolatepeanutbuttercup at 9:09 AM on November 12, 2005
Dean Edward's javascript for making IE compliant. Good luck!
posted by chocolatepeanutbuttercup at 9:09 AM on November 12, 2005
Response by poster: Honestly, I'll probably have to do it another way. A float would do it too, except I hadn't been able to get IE to do that properly either.
What really bothered me about this was the jump caused by resizing the window. Something about the re-rendering caused by the width change fixes the issue. So it's just... strange.
posted by Karmakaze at 8:55 AM on November 13, 2005
What really bothered me about this was the jump caused by resizing the window. Something about the re-rendering caused by the width change fixes the issue. So it's just... strange.
posted by Karmakaze at 8:55 AM on November 13, 2005
Response by poster: What I was trying to do, incidentally, was create marginalia. That is, be able to pull parenthetical remarks into a side column (or have them lay in with the text in the print layout). It works so easily in Firefox that I can only assume that the margin adjusted right float is not a hack, especially since the IE rendering error is so idiosyncratic.
posted by Karmakaze at 10:21 AM on November 15, 2005
posted by Karmakaze at 10:21 AM on November 15, 2005
Can you link a (preferably simplest case) html/css file that demonstrates the behavior? All this talk about margins and floating confuses me but if I can see it I can fix it :]
posted by moift at 12:49 PM on November 15, 2005
posted by moift at 12:49 PM on November 15, 2005
This thread is closed to new comments.
Check-out this thread, it has some interesting discussion on the topic. One of the posted solutions might be what you're looking for.
posted by purephase at 2:36 PM on November 11, 2005