css - IE: remove underline on pseudo-element -


on chrome , firefox, if apply text-decoration:underline on tag, default underline not apply pseudo element. on ie does, , can't remove it. want link underlined, not pseudo element. work if add span inside , put underline on it, want know if can made without additional markup.

a{		  	padding-left: 9px;  	position:relative;  	display:inline-block;    }  a:before{  	content:'\203a\00a0';  	position:absolute;  	top:0;  	left:0;  	display: inline-block;  }    #underline{  	text-decoration: none;			  }  #underline:hover{  	text-decoration:underline;  }  /* special ie */  #underline:hover:before  {  	text-decoration:none !important;	/* nothing ! */  }    #color{  	color:green;  }  #color:hover{  	color:red;  }  #color:hover:before{  	color:green;	/* work ! */  }    #span{  	text-decoration: none;  }  #span:hover span{  	text-decoration: underline;  }
<a href="#" id="underline">underline</a>  <br>  <a href="#" id="color">color</a>  <br>  <a href="#" id="span"><span>with span</span></a>

it seems ie don't let override text-decoration in pseudoelement if isn't set in it. first let pseudo-element underlined - text-decoration: underline - , afterwards override textdecoration: none.

#underline:hover:before  {  	text-decoration:underline;  }    #underline:hover:before  {  	text-decoration:none;  }


Comments

Popular posts from this blog

java - Oracle EBS .ClassNotFoundException: oracle.apps.fnd.formsClient.FormsLauncher.class ERROR -

c# - how to use buttonedit in devexpress gridcontrol -

nvd3.js - angularjs-nvd3-directives setting color in legend as well as in chart elements -