Is there an standard way to detect IE and Edge browsers in css? I saw responses for detecting in javascript file but I am looking for one in css
For IE 9 and lower, load a conditional stylesheet:
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
IE 10 and up doesn't support this, so you have to use media queries:
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS */
}
For Edge 12-15:
@supports (-ms-accelerator:true) {
/* Edge 12+ CSS */
}
EDIT
For Edge 16+
@supports (-ms-ime-align:auto) {
/* Edge 16+ CSS */
}