如何使 CSS 网格在 IE 上工作？ [复制]答案

【问题标题】：How to make CSS grid work on IE? [duplicate]如何使 CSS 网格在 IE 上工作？ [复制]
【发布时间】：2018-08-01 08:37:20
【问题描述】：

我正在尝试使用 CSS 网格在我的页面上创建一些列，但我无法让它在 IE 上运行。

这是我拥有的 CSS，它在 Chrome 和 Firefox 上运行良好。

.wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    grid-column-gap: 15px;
    grid-row-gap: 10px;
    grid-auto-flow: dense;
    margin: 1em auto;
    padding-left: 10px;
    padding-right: 15px;
    font-size: 12px;
}

是否可以将此 CSS 转换为在 IE 上工作？

【问题讨论】：

什么版本的IE？
IE11 支持旧版本的 CSS Grid 规范。它永远不会支持新版本，因为 IE 已经死了。
我需要让它在 IE 10 及更高版本上运行。
IE 不支持许多 CSS Grid 核心功能，例如自动放置网格项、列/行间隙、自动流。您必须手动放置项目并为每个网格项目指定 -ms-grid-row 和 -ms-grid-column。此外，您将无法在-ms-grid-columns 中使用repeat 之类的功能。

标签： css css-grid

【解决方案1】：

您可能能够在 IE >= 11 中使用 -ms- 前缀获得对 CSS 网格的部分支持。 Reference.

IMO 您可以使用flex 编写后备样式以支持旧浏览器，同时在新浏览器上利用 CSS 网格。

【讨论】：