CSS grid in Internet Explorer 11

When I was in Boston, speaking on a lunchtime panel with Rachel at An Event Apart, we took some questions from the audience about CSS grid. Inevitably, a question about browser support came up—specifically about support in Internet Explorer 11.

(Technically, you can use CSS grid in IE11—in fact it was the first browser to ship a version of grid—but the prefixed syntax is different to the standard and certain features are missing.)

Rachel gave a great balanced response, saying that you need to look at your site’s stats to determine whether it’s worth the investment of your time trying to make a grid work in IE11.

My response was blunter. I said I just don’t consider IE11 as a browser that supports grid.

Now, that might sound harsh, but what I meant was: you’re already dividing your visitors into browsers that support grid, and browsers that don’t …and you’re giving something to those browsers that don’t support grid. So I’m suggesting that IE11 falls into that category and should receive the layout you’re giving to browsers that don’t support grid …because really, IE11 doesn’t support grid: that’s the whole reason why the syntax is namespaced by -ms.

You could jump through hoops to try to get your grid layout working in IE11, as detailed in a three-part series on CSS Tricks, but at that point, the amount of effort you’re putting in negates the time-saving benefits of using CSS grid in the first place.

Frankly, the whole point of prefixed CSS is that is not used after a reasonable amount of time (originally, the idea was that it would not be used in production, but that didn’t last long). As we’ve moved away from prefixes to flags in browsers, I’m seeing the amount of prefixed properties dropping, and that’s very, very good. I’ve stopped using autoprefixer on new projects, and I’ve been able to remove it from some existing ones—please consider doing the same.

And when it comes to IE11, I’ll continue to categorise it as a browser that doesn’t support CSS grid. That doesn’t mean I’m abandoning users of IE11—far from it. It means I’m giving them the layout that’s appropriate for the browser they’re using.

Remember, websites do not need to look exactly the same in every browser.

Have you published a response to this? :

Responses

Šime Vidas

Stop using Autoprefixer? Hm, that doesn’t make much sense to me. Autoprefixer either adds prefixes that you need, or it’s a no-op, so why would you ever choose to remove it?adactio.com/journal/14131

Florens Verschelde

In which @adactio writes “I’ve stopped using autoprefixer on new projects, and I’ve been able to remove it from some existing ones—please consider doing the same.”adactio.com/journal/14131 I’ve considered doing that, as my main use case for prefixes was flexbox in Safari 6.1–8.

Sara Soueidan

“You could jump through hoops to try to get your grid layout working in IE11 […] but at that point, the amount of effort you’re putting in negates the time-saving benefits of using CSS grid in the first place.“ – @adactioadactio.com/journal/14131 So much this!

5 Likes

# Thursday, January 1st, 1970 at 12:00am

# Liked by Letra Studio on Friday, July 13th, 2018 at 12:42pm

# Liked by Qasim on Friday, July 13th, 2018 at 3:36pm

# Liked by Philippe Vayssière on Wednesday, August 29th, 2018 at 7:15pm

# Liked by Amber Wilson on Thursday, November 1st, 2018 at 11:41am