If you’ve ever done work for a government, financial or B2B organization, you might find yourself needing to support Internet Explorer 8. I know, I know: you’ve made your case for dropping support, pointing out that large SaaS companies are dropping support (or dropped support years ago), Microsoft itself is dropping support soon, development time could double, etc. But higher ups point out that 10+% of users are locked into IE8, and until corporate IT is able to justify OS upgrades, we’re stuck.
Don’t fret too much. It’s still possible to create a modern site and provide a pretty decent user experience on these older browsers, with some caveats. It probably won’t be a completely 1-to-1 experience from IE8 to a modern browser, but it should be enough to allow you to develop using best practices going forward while creating a not-completely-hideous result in IE8. Here are some of the tools you’ll need in your toolbox:
main, and others.
nth-childto clear elements, for example.
The next two links are especially handy. They allow for some nicer CSS decoration techniques that we’ve become used to that otherwise wouldn’t be possible on legacy browsers.
linear-gradient. Yes, you can still have depth and detail in your IE8 designs!
background-size: containbehaves as expected.
In addition to the links above, you’ll most likely have to make consessions for IE8 in your CSS. Things like a margin not working will have you climbing up the walls! Here are some common ones that I’ve come across:
overflow: autoto the clearing div.
filter. This property accepts several attributes, all noted here. A good reference I found for transparent backgrounds in particular is on CSS Tricks. These will definitely muck up your stylesheets, but if you want to provide a better user experience for your IE8 users, this is one of the ways.
I’m working on a rather large project redesign that needs IE8 support, so I’m sure I’ll find more issues in the future. But for now, the above tips and hacks have definitely kept me sane as I build out a modern experience that needs to support outdated browsers.
Now, you might have no real choice in supporting IE8 if you’re in the public sector or financials. But if you’re a freelancer? Make the same case for dropping support at the top of this article, and also charge double for IE8 support and testing :)