Providing CSS for just Internet Explorer

(*Disclaimer* – although this didn’t turn out to be the valid replacement for the underscore hack that I hoped it was, I thought I’d leave the post here as proof of what happens when you don’t check your facts thoroughly enough. Or more specifically, when you’re so tired, that you confuse a vaild HTML result to be valid CSS – hey ho!)

Today, I had one of those little CSS accidents, which led me to discover that an easy way to provide css for only IE (PC and Mac 5, 5.5 and 6) is to simply to add a comma after the the selector, but before the opening brace:

div, {
width: 80%;
}

Mozilla, Opera and Safari ignore the rule. It validates too!). I hope this is useful to someone.

The fact that IE 5 Mac applies the rule as well, could reduce its usefulness. If you have time, please test it further and let me know your results.

Tags: css, internetexplorer, webstandards, windows

IE Whitespace Bug

Its been a sort of Holy Grail for me (well maybe a Holy Teacup) to find a solution the IE Whitespace bug. If you’re not familiar with this, then you probably haven’t applied display:block to links within an unordered list. Adding this CSS property creates a solid ‘button’ out of what would’ve been a humble inline link, one that can be sized and prettied up as you like. The trouble is, IE windows adds another line height between all these links – unless you remove every bit of whitespace from the HTML.

Tags: bugs, code, css, internetexplorer, webstandards

IE 5 Mac notes

Some IE 5 Mac things I recently discovered:

• IE 5 Mac won’t float a bunch of
  ’s,

  ’s etc. unless you specify a width for them.
  
  
  • When I applied the Tom Gilder image replacement method to elements such as the site logo, Safari added a huge horizontal scrollbar (presumably 1000em wide). This only seemed to happen when the image was within nested divs, positioned absolutely. To get around this, all I had to was add overflow:hidden.
    Read the rest…

    Tags: bugs, internetexplorer, mac, osx