IE bugs I didn't know about yesterday

Internet explorer has many differences from the other browsers, and many bugs besides, today I ran into two more.

iframe with height:0 still leaves space in IE8

On the site I've been working on there is third party tracking, using an iframe. Since we need this to remain invisible, so as to not leave gaps, these have height="0".

Unfortunately this isn't working as expected in IE8 and a space is seen in the page. The solution I've applied is to position absolute the iframe, display:none is too risky since we need the content of the iframe to load.

IE6 and IE7 comments add spacing

On the same site each third party script has comments around it explaining what it does, both IE6 and IE7 take exception to this and start adding spacing. There are no floated elements around them so it's not quite like the Duplicate Characters Bug. The fix though is inspired by that same problem. I want to keep the comments so I've changed the comment tags to be conditional comments, .

When IE6 is dead...

Every web-developer on the planet, is waiting for the day we don't have to do anything for IE6. Nevermind creating scaled back versions for it, I'm talking about the day we don't even think about.

Wouldn't that be great.

Heres a quick list of the kind of simple CSS selecters we'd finally get to use;

Child selector

div > p - A little one to start with, but how useful. > matches only elements that are the direct children of the parent,

Sibling selector

p.bill ~ p.ben - If .bill is before .ben then the rule is true. Not the same as '+'.

Attribute selectors

div[aria-live=assertive] - Useful for more than just for input elements. and if you can find a use for them, advanced attribute selectors allow you to part match stings,

Multiple classes

div.big.red - Sure you can often get away with using these right now, but little risky no?

Inline-block

display:inline-block - IE6 lets you do this on inline elements, but being able to put these on a div cuts down those 'floating' headaches. Use with a liberal dash of -moz-inline-box or -moz-inline-block in FF2.

First-child

:first-child - If you can resist the temptation to move these around with JavaScript, it's the end of putting a class on your first navigation element... now if only last-child worked.

The day IE6 is dead can't come soon enough

Pay homeage to QuirksMode.org for the above research.