What actually happens to CSS in high contrast mode?
Can anyone explain what happens to CSS in high contrast mode?
http://hardlikesoftware.com/weblog/2009/11/04/css-sprites-vs-high-contrast-mode/
In high contrast mode all background images and colors are ignored — replaced with high contrast colors such as white on black or black on white. The other issue is that background images are not always printed.
Is there anything more than this?
I have login form that looks suboptimal and I am trying to investigate.
Untill recently there were https://www.google.com/search?q=axs+aol+accesibility+library but it doesn't seem to exist any longer.
Generally I see there two approaches:
- Detect HCM (high contrast mode) and adjust CSS accordingly
- Made CSS more generic to let it work in every mode
In either case I would really like to know what happens in high contrast mode in terms of changes to CSS.
As you see the behaviour varies so your expertise will be appreciated.
Answer
@media screen and (-ms-high-contrast: active) {
/* put your styling rules here */
}
Works in IE and MS Edge. Tested in Windows 10.
Chrome does not know whether Windows 10 is in high-contrast mode.