Question

I want to put an outline-color into a textbox when user types something wrong onto it. The problem is IE8 does not support the outline attribute (at least I test with no succeed) so I use border instead:

But I’d like to use border for IE8 and outline for browsers that support it.

.myclass
{
  border: ; // IE8 should use this
  outline: ; // Browser that support it must ignore the above one and get this.
}

I tested with IE8 and Chrome and both attributes are applied in Chrome and only the border in IE8.

Example:

.myclass
{
  border: 1px solid red;
  outline:#00FF00 dotted thick;
}

http://jsfiddle.net/puD97/

Thank you.

Answer 1

Who said IE8 doesn’t support outline property?

Still if you want different styles for IE and other browsers use IE specific stylesheets using IE specific cstylesheet comments

<!-- This will be ignored by all browsers but IE -->

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="ie-only.css" />
<![endif]-->

Or target any specific IE versions

<!--[if IE 8]>
    <link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->

Or in your page use this

<!--[if IE 8]>
    <style>
      /* Styles goes here */
    </style>
<![endif]-->