Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Apply CSS to all browsers except IE using media query

I found a way to apply media queries to IE using:

@media (-ms-high-contrast: none), (-ms-high-contrast: active) {

}

Is there a way do the same to apply CSS to all browsers but IE? Something like:

@media not( (-ms-high-contrast: none), (-ms-high-contrast: active) ) {

}

I'd like to avoid using the HTML tags.

like image 364
Tomarto Avatar asked Jan 23 '18 22:01

Tomarto


People also ask

Do media queries work in IE?

Media Queries SupportCSS Media queries are supported in Internet Explorer (IE) 9+, Firefox 3.5+, Safari 3+, Opera 7+, as well as on smartphones and other screen-based devices. Although older versions of IE don't support media queries, still there is a way you can make it work.


Video Answer


1 Answers

Use a @supports query for browsers that are not Internet Explorer. @supports queries are compatible with all browsers except Internet Explorer.

@supports not (-ms-high-contrast: none) {
   /* Non-IE styles here */
}

Example on Codepen

like image 122
Lars Gyrup Brink Nielsen Avatar answered Sep 21 '22 18:09

Lars Gyrup Brink Nielsen