1

I want to add style position:relative for ie and position:absolute for other browsers

this is my code

    <div id="textDiv"  style="display:none; background-color: #434343; padding: 5px 10px 5px 10px; margin-left: 10px; margin-top: 30px; position: absolute;"></div>

How to solve it

Dhaneesh Lal
  • 11
  • 2

2 Answers2

0

Ignoring maintenance problematics, the trick to target all browser except IE is to use @support() rule which is not supported at all on IE.

Antoine Cabrol
  • 31
  • 2
0

If you are trying to apply specific styles for the IE browser then you should try to use below media query to target the IE browser.

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

}

example:

<!doctype html>
<html>
<head>
<style>
#textDiv
 {    
      position:absolute;
      color:green;
 }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
 #textDiv
 {    
      position:relative;
      color:red;
 }
}
</style>
</head>
<body>
    <div id="textDiv">This is text...</div>

</body>
</html>

You can notice that CSS code inside the media query will only apply for the IE 10 or IE 11 browser.

Reference:

How to target only IE (any version) within a stylesheet?

Deepak-MSFT
  • 10,379
  • 1
  • 12
  • 19
  • Please accept the answer. It can help other community members in the future. Thanks for your understanding. Ref: https://stackoverflow.com/help/someone-answers – Deepak-MSFT May 04 '20 at 12:41