Css IE 11采用了我的响应式设计

当我在IE11中查看页面时，我的页面处于一种难看的响应模式，但正如在Chrome中所预期的那样。下面是我用来渲染屏幕大小的代码：

  @media screen and (min-width: 1100px) {
  #column {width: 75%;}
  #blue-nav{position: absolute;}
  #white-bar{display: block; }
  #footer-div {width: 100%;}
  #footer {width: 75%; position: relative}
  #body-left {float: left; width: 40%; height: auto;}
  #logo {position: relative;}
  #body-right {float: right; width: 60%; height: auto;}
  .breadcrumb {margin:0; padding: 0; padding-top: 50px;}
  #rectangle {  background: rgb(248,248,248);border-color: rgb(217,217,217);border-width: 1px;clear:both;  display: flex;}
  body {background-color:#f0f0f0;}
  #footer {display: block;} 
  #footer-table{display: table;}

}  

以下是我的标题：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

---

我不知道为什么它们在IE中看起来如此糟糕。此外，我的徽标周围有一个链接框，我的文字会从屏幕上消失。

@abluejelly是正确的。添加

<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

---

已修复。

原因是Internet Explorer错误地检测到它需要在IE 8传统模式下加载页面。这通常是由一个可以说是愚蠢的默认设置造成的，默认情况下，该设置使任何intranet站点都以IE8模式加载，这是一个非标准和缺少功能的领域

要解决此问题，您只需通过添加此元标记告诉IE不要这样做：

<meta http-equiv="X-UA-Compatible" content="IE=edge">

这告诉IE这不是IE8文档

---

请注意，此必须是发送的第一个标题（在

部分中的第一个标记），否则IE将忽略它。

顺便说一句，我是一个长期潜伏的SO，第一次海报。尝试添加

作为您的第一个标题。”因为你说的最后一句话听起来像是IE8 quirkI，那么我将正式说明这一点，并说明原因。