html - 在 css 中定位 IE 11 不起作用

Question

我正在尝试修复 IE11 中的一个微小布局问题，即 slider pip 跳出其位置(在其他主要浏览器中没问题)

我已将媒体查询添加到样式表(如下)，但没有运气。我还尝试过条件代码、各种黑客等。但没有任何效果或影响所有浏览器。我花了几个小时尝试各种解决方案，但没有任何运气，并且没有任何想法。需要帮助请。 Layout issue illustrated

  @media screen and (-ms-high-contrast: active),
  (-ms-high-contrast: none) {
    #yardstick-text-6-1 {
      margin-top: -43px;
    }
    #yardstick6-1 {
      margin-top: -53px;
    }
  }

网页可见here密码:quote321

Answer 1

尝试仅使用(-ms-high-contrast: none)，如下所示:

@media screen and (-ms-high-contrast: none) {
  #yardstick-text-6-1 {
    margin-top: -43px;
  }
  #yardstick6-1 {
    margin-top: -53px;
  }
}

或:-ms-fullscreen,:root .selector:

_:-ms-fullscreen,
:root #yardstick-text-6-1.ie11 {
  margin-top: -43px;
}
_:-ms-fullscreen,
:root #yardstick-6-1.ie11 {
  margin-top: -53px;
}

<div id="yardstick6-1" class="ie11">
  <div id="yardstick-text6-1" class="ie11"></div>
</div>

参见BrowserHacks for IE

注意:要轻松修复，您可以从 #yardstick6 中删除 float:left