2

I'm working to adjust some components so that they all function and look good in high-contrast mode. Edge seems to be adding a black background under all text that IE11 does not add. I can't seem to find a way to target this background in CSS, or any other way to normalize the behavior between the two browsers.

For example, let's say I have the following:

<div class="SelectedText">
  Text!
</div>

And let's say I assigned background-color: cyan; and color: black; to the .SelectedText div.

In this scenario, IE11 renders it as expected with the div and text having the assigned colors. However, in Edge the div background and text are given the right colors, but the text itself gets a black background drawn behind it, making it unreadable black on black text.

The following image illustrates this problem occurring in the context of menu items with with basically the same markup described above.

enter image description here

Is there any way to disable or target this extra background that Edge adds?

4

1 回答 1

5

最终找到了这个问题的答案。在父级上设置-ms-high-contrast-adjust: none;可以禁用 Edge 放置在文本后面的背景。

于 2017-08-23T16:12:08.303 回答