Stuff & Nonsense product and website design

The Guardian’s take on Mobile-first Responsive Web Design and IE8

The Guardian’s Kaelig Deloumeau-Prigent recently wrote about their struggles and strategy for dealing with Internet Explorer 8. People visiting my site using Internet Explorer 8 are few and far between these days, but those that do could be good customers, so with our redesign I wanted to make a real effort to give them a good experience.


Looking at their list of IE8 sad trombone properties:

  • We use pixels as fallbacks for rem units. Sure, Internet Explorer never scaled font sizes specified in pixels, but that was Microsoft’s choice and not my responsibility to work around.
  • Lack of @media query support is, of course an issue, so we serve people using legacy Internet Explorer a fixed-width, centred site. In three years doing that on all our client sites, not a single person has complained.
  • rgba(), hsla() falls back to solid colours where the design looks broken.
  • Lack of :last-child, :nth-child(), :first-of-type selector support isn’t often a problem. Sometimes people will see an occasional extra border on a list, but that’s a browser difference I can live with.
  • I use Modernizr to serve a single, composite background instead of multiple background images.
  • As legacy Internet Explorer see a fixed width design, its lack of background-size support is also rarely an issue.
  • box-shadows are a luxury that legacy Internet Explorer can’t afford.
  • As for a lack of border-radius support, just don’t mislead customers by selling them rounded corners in a static visual.

Very few of the properties that Kaelig Deloumeau-Prigent mentioned are ever a problem to me, but in our redesign, Internet Explorer 8’s lack of support for CSS columns was certainly our biggest issue and one that’s not gone away with recent updates to Internet Explorer either. I’m confused as to why, with all the great work that Microsoft have done with their browser over recent years, that CSS columns have been overlooked. They’re such a useful property when controlled well and are now extremely stable in every other contemporary browser I care about.

Our redesign really helped me to focus on how best to deal with Internet Explorer 8 and I’ll be rolling that experience back into our Rock Hammer toolkit when we release version two in the new year.


Written by Andy Clarke who filed this in css .


Would you like advice and inspiration on making better designs for the web?

Get monthly design inspiration and insights based on my 25+ years of experience. View some recent emails, sign up today, and get:

    I promise never to share your email address and you can unsubscribe with just one click.

    Free set of Layout Love grid templates when you sign up.

    Hire me. I’m available for coaching and to work on design projects.