css - @media 查询不适用于 IE11 但适用于 Chrome/FF

Question

因此，我一直致力于让我公司的这些墙板具有响应能力。问题是，使用我插入的 css，它在 Chrome 和 FF 上运行良好。但是在 IE 上什么也没有发生，他们正在从 FF 转到 IE atm，所以这必须工作。

代码如下所示:

html, body {
            background: none repeat scroll 0 0 #8FAE9F;
            font-family: Trebuchet MS;
            font-size: 27px;
            font-weight: bold;
            height: 99%;
            margin: 0 auto;
            padding: 0;
            text-align: center;
        }
        .column.OBJ0, .column.OBJ1 { /* margin bruges til at mindske eller øge mellemrummet mellem overskrifterne */
            max-width: 12.0em;
            margin-right: -1.2em;
            margin-left: -1.2em;
        }
        .blueBorder, .thresholds {
            margin: 0;
            padding: 5px;
            width: 98%;
        }
        .thresholds {
            display: inline;
            float: left;
        }
        .Threshold_NONE {
            color: black;
        }
        .Threshold_INFO {
            color: green;
        }
        .Threshold_WARNING {
            color: yellow;
        }
        .Threshold_ALERT {
            color: red;
        }
        .Threshold_INFO, .Threshold_WARNING, .Threshold_ALERT, .Threshold_NONE {
            font-size: 5em;
        }
        .displayText {
        }
        .column {
            display: inline-block;
            float: left;
            margin: 0;
            padding: 0;
            text-align: center;
            vertical-align: text-top;
            line-height: normal;
            white-space: nowrap;
        }
        .header { /* max-height ændres hvis brugere skal tættere på overskrift */
            color: black;
            font-size: 3em;
            margin-left: -4px;
            margin-right: -4px;
            margin-top: -4px;
            max-height: 1em;
        }
        .columnwrapper {
            min-width: 378px;
            text-align: center;
            white-space: nowrap;
            width: 25%;
        }
        .displayAgent {
        }
        .displayAgent img {
            float: left;
            margin-bottom: auto;
            margin-right: 0.5em;
            margin-top: auto;
        }
        .displayAgent1 {
        }
        .displayAgent2 {
            background-color: #E6E6E6;
        }
        .displayAgentName {
            display: table;
            text-align: right;
        }
        .displayAgentStatusImg {
            padding-left: 0.5em;
        }
        .displayAgentStatus {
            display: inline;
            width: 71px;
        }
        .displayAgentStateTime {
            display: inline;
            width: 61px;
        }
        .displayAgentStatus_LoggedIn {
        }
        .displayAgentStatus_NotReady {
        }
        .displayAgentStatus_Ready {
        }
        .displayAgentStatus_Reserved {
        }
        .displayAgentStatus_LoggedOut {
        }
        .displayAgentStatus_Talking {
        }
        .displayAgentStatus_Working {
        }
        div .displayAgentStateTime {
            display: none;
        }
        div .displayAgentStatus {
            display: none;
        }
        .PoweredBy {
            bottom: 10px;
            display: none;
            font-size: 0.8em;
            padding: 5px;
            position: fixed;
            right: 10px;
        }
        .lastupdate {
            background: none repeat scroll 0 0 white;
            display: table;
            font-size: 1.2em;
            margin-top: 0;
            width: 7em;
        }
        .viewerDisplayItemErrorPanel {
            color: red;
            font-weight: bold;
        }
        .headline.remedyItem {
            font-weight: bold;
        }
        .remedyItem span {
            display: inline-block;
            font-size: 1em;
            max-height: 1.2em;
            overflow: hidden;
        }
        div.headline.remedyItem {
            text-align: center;
            border-bottom: 4px solid;
        }
        span.remedyId {
            width: 6em;
        }
        span.remedyCustomer {
            width: 6em;
        }
        span.remedyPriority {
            width: 2em;
        }
        span.remedyCaseTitle {
            text-align: left;
            width: 17em;
        }
        span.remedySLA {
            width: 5em;
        }
        span.remedySubSlaType {
            display: none;
        }
        span.remedyHidden {
        }
        span.remedyShowSLA {
            width: 4em;
        }
        span.remedyGroup {
            width: 6em;
        }
        div.column.Remedy {
            clear: left;
            margin-top: 0.5em;
        }
        div.column.Remedy h2 {
            display: none;
        }
        div.uccx_exchange_user span.exchangeStatus {
            display: none;
        }
        div.uccx_exchange_user span.uccxStatus {
            display: none;
        }
        div.uccx_exchange_user span.user { /* Desto højere width, desto mindre afstand mellem brugere horisontalt*/
            display: inline-block;
            font-size: 1em;
            width: 3.9em;
        }
        div.uccx_exchange_user { /* Desto højere height, desto mere afstand mellem brugere vertikalt */
            max-height: 0.92em;
        }
        div.uccx_exchange_user img {
            margin-top: 0.2em;
            padding: 0;
        }
        .viewerDisplayItemShowPanel.øst { /* Dette påvirker øst brugeres position. */
            clear: right;
            float: right;
            text-align: left;
        }
        .viewerDisplayItemShowPanel.vest { /* Dette påvirker vest brugeres position. */
            clear: left;
            float: left;
            text-align: right;
            margin-left: 1.5em;
        }
        .viewerDisplayItemShowPanel.øst div img { /* Dette påvirker øst brugeres status position. */
            float: center;
            margin-left: -5.6em;
            margin-right: 0.0em;
        }
        .viewerDisplayItemShowPanel.vest div img { /* Dette påvirker vest brugeres status position. */
            float: center; 
            margin-left: -0.8em;
            margin-right: 0.1em;
        }

        .column h2.header { /* font-size ændres for at ændre gruppenavnets skriftstørrelse. */
            font-size: 1.7em;
            margin: 0;
        }
        .headline.remedyItem .remedyPriority {
            background: none repeat scroll 0 0 red;
            display: none;
        }
        .headline.remedyItem .remedyCustomer {
            margin-right: 3em;
        }
        span.NOT_SET {
            color: white;
        }
        div.FIX_AT_NONE .remedyId {
            color: yellow;
        }
        span.NORMAL_ALERT, span.FIX_AT_ALERT {
            color: red;
        }
        span.NORMAL_WARNING, span.FIX_AT_WARNING {
            color: yellow;
        }
        span.NONE_WARNING, span.NONE_NONE {
            color: blue;
        }
        span.NONE_ALERT {
            color: purple;
        }
        .BURNED {
            color: red;
        }
        .P1.remedyPriority {
            background-color: red;
        }
        .P2.remedyPriority {
            background-color: yellow;
        }
        span.RESPECTED {
            color: green;
        }
        span.remedyUserLoginID {
            display: none;
        }
        span.penaltyOn {
            display: none;
        }
        @media all and (max-width: 1080px) {
            html, body {
                font-size: 20px;
            }}
        @media all and (max-width:800px) { 
/*  Dette smides ind til skalering. Alt der foregår i denne boks sker når skærmen     kommer under 640px. */
            html, body {
                font-size: 15px;
            }}

那我做错了什么？该程序只允许我输入 css，不能制作 extern css 文件或任何东西。只有一个这样的 css 文件。

感谢您提供的建议

Mikkel - 实习生!

Answer 1

媒体查询通过这种方式在 IE-11 中工作:

@media all and (min-width: 1024px) {
    ... 
}

更多详情来源link