CSS - 背景颜色在IE11中不起作用

Question

我有以下代码：

.skills_column {
  padding: 50px !important;
  padding-top: 60px !important;

  &.--light {
    background-color: white;
  }
  &.--dark {
    background-color: #ced4db;
  }

  @include media-breakpoint-down(sm) {
    h1 {
      text-align: center;
    }
  }
}

有3列，一列轻，两列暗。 所有这些都适用于Chrome＆amp;但是，Firefox在IE11中不起作用：

虽然灯光是预期的白色，但另外两个应该是暗的列在IE11中也是白色的。

问题是什么？ 我还尝试添加filter: none !important;，因为我在某处读到了，但这似乎没有什么区别，虽然我可能没有正确应用它，但我不确定。

我也在使用flexbox，如果这应该有所作为。但我的问题是没有应用背景颜色。

Answer 1

您可以尝试从类名（--dark，--light）中删除双连字符。我有一种感觉，IE不喜欢BEM表示。也许是单下划线或双下划线。

.skills_column {
  padding: 50px !important;
  padding-top: 60px !important;

  &._light {
    background-color: white;
  }
  &._dark {
    background-color: #ced4db;
  }

  @include media-breakpoint-down(sm) {
    h1 {
      text-align: center;
    }
  }
}