IE和Edge中的样式

Question

我正在研究手风琴，这种风格写在公司内部。 我的初始输出Chrome看起来像这样

向下箭头位于右上角。它在FireFox中也很好， 但是当我们尝试在IE和Edge上显示时，箭头会移动到左侧。

以下是我对以下要素的检查：

手风琴的标题

.accordion .accordion-header {
    font-family: "MuseoSans-300", Helvetica, Arial, sans-serif;
    font-size: 1.15em;
    line-height: 1.4;
    color: #6d8191;
    margin-bottom: 0;
    padding: 15px 30px 15px 0;
    position: relative;
    border-top: 1px solid #d8d8d8;
}

手风琴之箭：

.accordion .accordion-header .accordion-arrow {
    float: right;
    margin-right: 15px;
    position: absolute;
    top: 13px;
    right: -3px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.25s, -webkit-transform 0.25s;
}

是否有任何建议要解决此问题，以及Edge？

Answer 1

这适用于Edge 12+

@supports (-ms-ime-align:auto) {
  .selector { property:value; } 
}

read on @supports as a rule

所以做对齐就是这样：

@supports (-ms-ime-align:auto) {
      .accordion .accordion-header .accordion-arrow {  right:value; } 
    }

Explorer 11+浏览器（我还没有测试过）

_:-ms-fullscreen, :root .selector { property:value; }