javascript - 对于 Angular Material md-select，选择菜单背景在 IE 上变黑

Question

IE-11 和 IE-edge 浏览器的 Angular Material 存在一个问题，

当正文内容垂直滚动时，angular meterial 会显示选择框周围的黑色边框，如图所示。

这里也是复现问题的code pen。

<md-input-container>
<label>State</label>
<md-select ng-model="ctrl.userState">
<md-option ng-repeat="state in ctrl.states" value="{{state.abbrev}}" ng-disabled="$index === 1">
{{state.abbrev}}
</md-option>
</md-select>
</md-input-container>
http://codepen.io/anon/pen/BzRjBx

可以通过删除 position:fixed 来解决问题.但它会产生 Angular Material 功能的问题。

怎么办？

Answer 1

我之前发布的其他答案似乎都不是最合适的，尽管它们最初似乎解决了问题。

真正的罪魁祸首似乎是 angular-material 设置的背景。

有关修复，请参阅以下代码笔: http://codepen.io/anon/pen/gwOdNm

以下样式会导致此问题:

html.md-default-theme, html, body.md-default-theme, body {
    color: rgba(0,0,0,0.87);
    background-color: rgb(250,250,250);
}

覆盖以下样式似乎完全解决了这个问题:

html.md-default-theme, html, body.md-default-theme, body {
    background-color: transparent;
}