People who take our Foundation training course aren’t the only ones who come away with more knowledge than they started. Our students sometimes share their ideas with us — and we want to share one with you today.
As you might know, Foundation 4 doesn’t support Internet Explorer 8. With IE8 slipping in usage, we thought it was the right time to let it go. But one person couldn’t. Too much of site’s traffic used IE8 to just let go. After taking our Foundation class, he came up with a jury-rig that combines Foundation 4 with IE8-friendly Foundation 3.
The setup
The first step involves setting telling IE which version of Foundation to choose —3 or 4 — based on Explorer’s own version. Below is what he came up with, which looks fairly solid.
In the HTML head:
And after the close body tag:
The conditionals determine which version of Foundation IE loads. IE8 and older will grab Foundation 3 code. Others, Foundation 4.
The grid
The syntax for Foundation 4’s grid, which accounts for mobile and widescreen devices, uses two prefixes: small-# and large-#. Foundation 3, though, uses spelled out English words: one, six, twelve etc. That means the two systems can intermingle without interfering:
Having to manage three sets of grids isn’t ideal, but if you use Foundation 4 and need to support older browsers, this unofficial workaround may do the trick.