Question

Mine would have to be the float and margin bugs...

If you float an element, and then specify a margin for it, it will double the margin.

The solution to this is to add display: inline to the element. This will stop the double margin, and all other browsers will ignore it because only block level objects can be floated.

Was it helpful?

Solution

I wish I'd known that I'd be spending hours trying to fix a bug in IE 6 over and over again for years on end and I really would have been happier delivering pizza.

OTHER TIPS

I wish I knew about quirksmode.org. The compatibility tables, bug reports, javascript examples are all very useful.

Don't code for IE6 first. That's the path to madness.

I wish I'd known that many IE 6 error line numbers are off by one.

Number one thing: hasLayout If I had known about this from the start most of my worries would've been solved. I even regard it as a worse problem than IE6's stupid box model.

That if your really anal and spend shit loads of time on it that it pays off and you then become an IE guru fearing nothing but the sad self you have become...

Although it is nice to impress people with your amazing IE bug fixing abilities...

  1. Most IE bugs can be avoided by using different (normally better) CSS methods and super clean logical xhtml
  2. Always clear your floats with overflow hidden (or just hasLayout for IE)
  3. Understand what hasLayout is (basically a css porperty that gives IE a kick in the ass)
  4. When you start devving sites check IE6 all the time, untill your a pro ;¬P

Unfortunately, and I do train a small team of 6 developers, experience is one of the only things that really helps with these problems, stay calm, do good research in google and post your problem to a community if you really are stuck with a good demo of the problem.

Nice links >

  1. http://css-tricks.com/ie-css-bugs-thatll-get-you-every-time/ (although I recommend the PNG fix by Bob Osola /-0)
  2. http://www.gtalbot.org/BrowserBugsSection/ (amazing and funny... great!)

Good luck!

I wish I'd known why Microsoft hated me so much.

I wish I'd known about Position is Everything, but specifically the peekaboo bug has always got me.

I wish I'd known about

  • the conditional comments to include stylesheets just for IE
  • xhtml headers to make IE render in compliant mode
  • the box model problem, so that I knew what to put in my IE stylesheet

After I learned about these things, I haven't really used a lot of time fixing problems in IE6

.Hauge

Transparent PNG should have been supported...

the underscore trick

if you put an _ infront of the css atribute it only gets read by ie6.

ie. _border: 1px solid #000000; creates a border only in ie6

Probably that SELECT elements dont render with the correct z-order.

For example, if you have a floating DIV with a higher z-order overlayed on top of a select - the SELECT element will still render on top of the DIV.

Infuriating.

The rendering quirk which causes a small white space underneath an image in a table cell if there is any white space between the end of the img tag and the closing td tag.

This renders right:

<td><img src="myimage.jpg"></td>

This renders wrong:

<td>
<img src="myimage.jpg">
</td>

The main problem we have had is with scheduling enough "fix in IE6" time. That and the designers' tendency to come up with stuff that is easy to do in Flash and tricky to achieve in CSS has cost us many days of extra work.

I wish I knew that my code didn't validate. Or that an XML declaration in XHTML puts IE into quirks mode.

http://www.pushuptheweb.com/ or one of many other sites pushing to drop IE6 support. I'm aware that rendering web pages correctly for IE6 visitors is the core of many web businesses, but sooner or later something has to give. I just dont get why MS doesn't force an update >.<

That even with all the PNG hacks in the world, if you're using PNGs as backgrounds in your divs (to make, for example, a panel with rounded borders), you're headed for a world of pain. (Links and other elements not being clickable, IE6 crashing in earlier versions of the png dll, etc.)

In summary: don't use transparent background PNGs if you want it to work in IE6.

The importance of DOCTYPES in IE, and

Web Bug Track

I Wish I'd Known That Internet Explorer Is The New Netscape Navigator 4.7.x

1

hasLayout and this excellent explanation: http://www.satzansatz.de/cssd/onhavinglayout.html

I had a new lease on life once I'd wrapped my head around it! Ensuring that the containing element hasLayout fixes the vast majority of my problems.

2

jQuery!! Writing IE-specific CSS is bad enough, so I'm glad I rarely have to worry about JS anymore.

I wish I'd known about dev tools like Firebug Lite and HttpWatch that make debugging lots easier.

in addition to other IE bug lists that Ross and Loque gave above (gtalbot.com, what a beautiful site!

http://css-discuss.incutio.com/?page=InternetExplorerWinBugs

http://webbugtrack.blogspot.com/search/label/IE7

http://www.enhanceie.com/ie/bugs.asp

http://channel9.msdn.com/wiki/internetexplorerprogrammingbugs/ (like gtalbot, it'll take you hours to scroll thru this


and, hey, IE 8 beta 2

http://css-class.com/test/bugs/ie/ie-bugs.htm


finally, the IE voodoo doll!

http://www.flickr.com/photos/chisa/1349759901/

*{margin:0; padding:0; border:none}

i swear to god this line changed everything. presto! everything is the same size! and then i dove into the rabbit hole that ya'll find me in now. marvelous.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top