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
Yes, both Edge and IE11 come built-in to Windows 10 for PCs.
The Edge icon, a blue letter "e," is similar to the Internet Explorer icon, but they are separate applications. To open Internet Explorer, open the Windows menu in the lower left corner of your screen and begin typing "Internet Explorer." IE will pop up in a search menu. Simply click on it to open.
Microsoft Edge is the faster, more secure browser recommended browser by Microsoft. Support for Internet Explorer 11 has ended on June 15, 2022. If any site you visit needs Internet Explorer 11, you can reload it with Internet Explorer mode in Microsoft Edge.
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 */
}
The accepted answer for Edge isn't working in Edge 16.
This alternative works:
@supports (-ms-ime-align:auto) {
/* IE Edge 16+ CSS */
}
Via https://stackoverflow.com/a/32202953
(Adding new answer as I don't have comment privileges.)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With