仅适用于 Internet Explorer 的媒体查询答案

【问题标题】：Media queries for Internet Explorer only仅适用于 Internet Explorer 的媒体查询
【发布时间】：2017-01-20 06:51:41
【问题描述】：

我知道只能使用这个 CSS 获得 IE 的样式：

@media all and (-ms-high-contrast:none) {
     .foo { color: green } /* IE10 */
     *::-ms-backdrop, .foo { color: green } /* IE11 */
}

并且可以使用媒体查询使网站具有响应性：

@media only screen and (max-width: 800px) {
    .foo { color: green }
}

如何编写代码以仅在特定屏幕尺寸下为 IE 创建样式？以下都不适合我，IE 只是忽略了这种风格：

@media only screen and (-ms-high-contrast:none) and (max-width: 800px)

@media all and (-ms-high-contrast:none) and (max-width: 800px)

想法？

【问题讨论】：

【解决方案1】：

IE、Safari、Chrome 和谷歌。出于某种原因，当我使用 flexbox 时，我的 div/列在 IE 上比其他 3 个主要浏览器占用更多空间。所以我必须在 IE 上指定 0 0 23% 的 flex，如果我想要 4 列来适应一个页面，否则第 4 列会下降到其他 3 列之下。

然后，当浏览器尺寸减小（例如

但是，我不知道如何为

希望这是有道理的。

除非我错过了什么。我对 flexbox 比较陌生，所以这是可能的。

【讨论】：