Dealing with IE5/Mac

Oh the times I’ve spent changing the way I layout pages, and even designs, solely to make up for IE5/Mac. I can’t count the number of times I think I have a layout nailed, even with the most basic styles, and I test it in IE5/Mac and it breaks. And for no good reason. Even this very site (CMYK design) had a rendering problem that is no fault of CSS, just poor browser programming.

I’ll admit that in its hayday, IE5/Mac was king: the best CSS support, fast loading, and it looked pretty good (for the times). But in these days of more advanced browsers, and more specialized CSS, it just doesn’t cut it. So what does this mean? It means that for this site (CMYK style only), I am only providing basic color and font information to IE5/Mac. That’s it.

The errors caused by this browser were not because of my poor CSS authoring, nor bad XHTML structure, nor even multiple browser-specific hacks clashing. It’s just a rendering problem with the browser. So instead of letting IE5/Mac users get hurt by their own browser, I’ll just provide them with a (nearly) unstyled version, fully usable and functional, just not as pretty as the others. I’m not the first to make this decision, either.

On a side note, I’ve often wondered why people on newer Macs even use IE5, when a perfectly good Safari is right there. I could be wrong on this, but is the IE5 icon even on the toolbar in the original configuration? Perhaps that’s a different article. Anyway…

So to make this article useful, I thought I’d provide a few methods for easily hiding/including styles from/for IE5/Mac.

Method 1

To hide just a few styles in your CSS, you can use the following:

/* Hide from IE5/Mac */ <br /> &nbsp;&nbsp;Styles <strong>NOT</strong> for IE5mac go here<br /> /* Stop Hiding */

This works well, but is not the easiest thing to remember. It’s also not very good for lots of styles too, since you cannot comment your code inside the hack.

Method 2

For larger groups of styles, you can take advantage of IE5/Macs lack of support for @media like this:

Styles for all browsers here<br /><br /> @media screen {<br /> &nbsp;&nbsp;Styles <strong>NOT</strong> for IE5/Mac go here<br /> }

If you run into issues with IE5/Mac that must be fixed, but you just can’t seem to use the same styles as other browsers (because of rendering problems or CSS bugs), and your feeling ambitious enough, you could create an entirely different stylesheet for IE5/Mac and apply it like this:

@import("ie5_mac_styles.css"); <br /> /* Hide from IE5/Mac */ <br /> &nbsp;&nbsp;@import url("styles_for_all_but_ie5mac.css");<br /> /* Stop Hiding */

*IE5/Mac is the only browser to understand the @import method when it’s written with no spaces and sans-url. Details can be found here.

To save a little face, let me say that I’m not about to stop styling IE5/Mac just because it’s buggy. If I stopped styling for buggy browsers, I wouldn’t be styling at all. Each browser has it’s quirks, but there are some instances I’ve run into that IE5/Mac just will not handle. It’s in these cases that I prefer sending a more scaled-back style than a broken one.

Post and Author Info.

Published January 05, 2005 by:

This article is tagged with , , , and .

Commenting is currently off for this post.
So far there are 25 comments.

25 comments

  1. http://www.stopdesign.com/examples/ie5mac-bpf/

    For importing a IE5/mac-only style sheet. Yet another method.

    GeertDD GeertDD

    January 5th, 2005

  2. Dan popped the question When can start hiding styles from IE5

    My solution is to bring in the new year and say

    Good bye to IE5 for 2005. For all my websites from here on out it’s like this:
    @import&quot;styles.css&quot;;

    This is great. I love hearing more complaints about IE5. I mean, at least we have a reason to keep IE6 in the mix. The amount of users that actually use IE5 is so minute that it seems almost pointless.

    Dustin Dustin

    January 5th, 2005

  3. Having recenlty purchased an iBook (I love it :-), I can confirm that IE is no longer on the dock by default.

    Neal Neal

    January 5th, 2005

  4. Thanks for the lookout neal. I had known that safari was the default browser for OSx, but still came with IE5…
    so it’s good to know it’s not on the dock by default anymore :)

    Dustin Dustin

    January 5th, 2005

  5. I’m stopping by to say hi since it’s de-lurker day and I’m a lurker here… so hi and Happy New Year! :)

    Carla Carla

    January 5th, 2005

  6. I’ve also made the decision to hide styles from IE5/Mac on both my blog and my portfolio website. Now to find some time to get it done…

    Jeff Smith Jeff Smith

    January 5th, 2005

  7. Just for giggles, can you tell us what percentage of this sites visitors use IE5/mac?

    Erik Erik

    January 6th, 2005

  8. According to my stats software, IE<6 usage is around 1.2%. But that’s not split between operating systems. Visits to the site by Macs is only 17%, so with some browsing still done in IE5.5 and IE5.0 in windows, I’m going to assume the percentage is far less than 1.2%.

    What about you others who have hidden IE5/Mac. What where you’re stats like?

    Steve Smith Steve Smith

    January 6th, 2005

  9. My IE stats are basically the same. 2% using IE

    Jeff Smith Jeff Smith

    January 6th, 2005

  10. Here’s a full list of browsers and percentages

    IE 5.0 and 5.5 combine for 2.1%

    Oh how I love all this talk of hiding styles from IE5.
    And afterall, it’s not like we’re ignoring them. As long as your website degrades nicely, then we’re all good.

    Dustin Dustin

    January 6th, 2005

  11. I just stopped caring about IE5. And for that matter, I stopped caring about IE all together. My most recent layout looks great on netscape, firefox, mozilla, and pretty good on safari, but IE? Horrible. I just decided I’d put a big Get Firefox button on the sidebar and say forget it.

    Ian Ian

    January 6th, 2005

  12. I would like to say you’ve got a great attitude Ian, but definitely a poor outlook on practicality. We, You, and I all know that IE6 still needs to be kept in mind as long as it holds any market share above 10%. The truth is, it’s still around 85% – 88% (last reported in December ‘04) on a global scale.

    However if it’s for your own personal blog website, then suite yourself.

    My personal advise is don’t be a browser elitist…you’re no different than those who design for IE only.

    If I owned an e-commerce website and my income depended on it, I’d probably still put IE5 back on my dinner plate.

    Dustin Dustin

    January 6th, 2005

  13. Since my busy sites stats were deleted last month (changed hosting service) I’ll list the stats for a rather low traffic site.

    Total visits in 2004: 600 (told you it was low volume)
    IE 6: 50%
    IE

    Erik Runyon Erik Runyon

    January 7th, 2005

  14. (previous post was truncated due to an ill placed ‘less than’ symbol)

    Since my busy sites stats were deleted last month (changed hosting service) I’ll list the stats for a rather low traffic site.

    Total visits in 2004: 600 (told you it was low volume)
    IE 6: 50%
    IE less than 6: 15%
    Window (all version) 70%
    Mac 22%

    And as much as I’d like to give up on IE myself, you have to look at it from a standard users view.
    1. They use Windows. It’s all they know. It’s all they’ve ever known. Therefore (sad to say) they’re probably using IE. Alway will as long it’s the default browser in Win. They’re probably not even aware other browsers exist. And even they do, they may not have the saavy to download and install something different.

    2. Let’s say you give up on Windows like Ian above. Fine. Joe schmoe visits a site you coded. Now Joe knows nothing about browsers, standards, compliance, etc. All Joe knows is that your site looks like trash in HIS browser. That will reflect badly on a) the company/entity the site represents and b) the author of the site. Tell good ol’ Joe about Firefox all you want. Good chance he won’t understand.

    So as web professionals in 2005, we just have to suffer through the pains and headaches of coding with IE compatibility in mind.

    Erik Runyon Erik Runyon

    January 7th, 2005

  15. that’s what i’m talkin’ ‘bout erik. ie6 is all people know. and just to clarify, the difference between ie6 and ie5 are quite tremendous. it’s ie5 that’s the problem, not so much ie6. If you haven’t figured out to code for ie6 then you’ve got much work ahead of yourself. aside from the many other things like active x, louzy security, and poor features, ie6 only has a handful of layout bugs that come to mind, and there are simple work arounds for all of them.

    but what are ya gonna do… our jobs are to know these kinds of things.

    Dustin Dustin

    January 8th, 2005

  16. I was trying to hide ALL styles (implementing Method 2) from IE5/Mac so that visitors would see a full textversion, but functional site. But a further effect was that on my system WIN XP with Opera 7 the fullscreen mode (F11) didn’t work too. It also came up with a pure text version.

    Björn Björn

    January 10th, 2005

  17. just to clarify something…which one was method two?
    Dithered shows that @import”styles.css”; will leave Opera in the mix and hide from both IE5 win & Mac…

    Dustin Dustin

    January 10th, 2005

  18. I did hide the styles by using the

    @media screen {
    Styles NOT for IE5/Mac go here
    }

    Then when switching to fullscreen view with opera, the styles where ignored. Not a real bug but a behavior of the browser that I don’t understand.

    Björn Björn

    January 12th, 2005

  19. Try @media screen, projection. I wonder if Opera is thinking that fullscreen mode is for projection? Worth a shot. Let us know the results if you can.

    Steve Smith Steve Smith

    January 12th, 2005

  20. Thank you! Now the fullscreen mode’s served with CSS, too.

    Björn Björn

    January 12th, 2005

  21. degrade nicely and work with any browser – I love dillo, firefox and off-by-one – but IE people get so many popups, spyware etc…... as there machines grind to a halt that they are giving up on the net and computers in droves. Lets keep there stuff simple and let them find a better way.

    nigel nigel

    April 26th, 2005

  22. I just want to say I mistakenly helped a friend out on a site using my windows pc and testing it with FireFox, Opera, IE etc etc. Everything was cool until the day I deployed it. It turns out the client uses Macs with IE, I assumed it would be fine as I’ve heard IE had extensive support for CSS however it turns out to be crap and I have no clue how to fix it. I really just wanted to vent some frustration…....

    Cheers

    Bill Bill

    May 4th, 2005

  23. This specifies IE5 MAC only styles > But these styles still appear in Firefox and Opera on PC, Win2k.

    Here’s the hack: \> a { color:#3c6341; text-decoration:underline; position:relative; z-index:1001; }

    By placing a \ before *> this hides it from FF and Opera in PC, but still allows MAC IE5 to view it.

    James B. James B.

    May 18th, 2005

  24. My understanding is that Macs no longer ship with IE at all (as of 5/2005). IE was still there up to that point for people who “needed” the same browser they had been using on Windows, and didn’t trust Safari, Firefox or Omniweb, but this crutch is no longer provided.

    The reason not to support IE at all (v6 included) when allowable by policy is to create a web-wide disincentive to using dramatically non-compliant browsers. Whether one takes KHTML/Safari or Gecko/Firefox, there are differences in implementation but both renderers want to map to W3C recommendations.

    -RS

    Rahul Sinha Rahul Sinha

    June 17th, 2005