Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve support for Windows High Contrast Mode and Internet Explorer 11 #2293

Open
1 of 2 tasks
lfdebrux opened this issue Aug 2, 2021 · 1 comment
Open
1 of 2 tasks
Labels
accessibility documentation User requests new documentation or improvements to existing documentation

Comments

@lfdebrux
Copy link
Member

lfdebrux commented Aug 2, 2021

This builds on work by @chris-gds for the accordion component refresh in #2257.

What

Add media feature -ms-high-contrast to media queries that change styles for Windows High Contrast Mode.

Add CSS property -ms-high-contrast-adjust where property forced-color-adjust is used.

For example, see draft PR #2290

Why

Internet Explorer 11 doesn't support the forced-colors media feature or the forced-color-adjust property, but it has equivalents in -ms-high-contrast and -ms-high-contrast-adjust.

We can port fixes for High Contrast Mode such as improved focus states for radios and checkboxes (#2264) that currently work in Edge / Chrome / Opera but not Internet Explorer.

According to the 2018 WebAIM survey of users with low vision, a higher percentage use Internet Explorer than Edge.

Who needs to know about this

Devs

Done when

@lfdebrux lfdebrux added the awaiting triage Needs triaging by team label Aug 2, 2021
@lfdebrux
Copy link
Member Author

lfdebrux commented Aug 2, 2021

It would be nice if autoprefixer dealt with this for us, however it looks like this functionality won't be added: postcss/autoprefixer#1351

We could add a mixin for Windows High Contrast Mode (as suggested by @chris-gds), however even in that case we would need to be careful when using it to make sure we include prefixed CSS properties such as forced-color-adjust/-ms-high-contrast-adjust.

Also, there may be scenarios where we want to use the forced-color media query but not the -ms-high-contrast media query (thanks for flagging this @36degrees).

@vanitabarrett vanitabarrett added accessibility documentation User requests new documentation or improvements to existing documentation and removed awaiting triage Needs triaging by team labels Sep 24, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility documentation User requests new documentation or improvements to existing documentation
Projects
None yet
Development

No branches or pull requests

2 participants