CSS Specificità diversa su firefox e explorer

[batello]

Salve, sto scrivendo una pagina web e, tramite CSS, ho creato un semplice effetto che genera un triangolo sul bordo di un div attraverso un before.
Il punto è che su firefox riesco a vederlo senza problemi mentre su explorer ho visto da sorgente che la classe esiste ma il before (solo il before) è sovrascritto da non ho capito cosa.
Come è possibile che la specificità cambi da browser a browser e come faccio a capire chi è che mi sovrascrive il before?
Il codice html è questo:

Codice: Seleziona tutto

<div class="dropdown-menu">
   <div class="col-xs-4 headerProductsLeftPanel">
	  <a class="col-xs-12 headerProductsLeftPanelText" href="#">Finanziamenti: cosa è</a>
          <a class="col-xs-12 headerProductsLeftPanelText" href="#">Prodotti</a>
	  <a class="col-xs-12 headerProductsLeftPanelText" href="#">La specializzazione MCI</a>
   </div>
  <div class="col-xs-8 product_group">
	<span class="col-xs-12 headerLabelScegliProdotto">Scegli il prodotto che soddisfi i tuoi bisogni</span>
	<div class="col-xs-4 cont_prodotto gnuolane">
		<a style="text-transform: uppercase;" href="#">Nova+</a>
	</div>
	<div class="col-xs-4 cont_prodotto gnuolane">
	        <a style="text-transform: uppercase;" href="#">Energia Sostenibile</a>
	</div>
	<div class="col-xs-4 cont_prodotto gnuolane">
	        <a style="text-transform: uppercase;" href="#">Internazionalizzazione</a>
	</div>
   </div>
</div>

mentre il CSS in questione è

Codice: Seleziona tutto

.product_group{
	
	padding-bottom:45px;
	border-left:1px solid #ccc;
	min-height:365px;
	
	
	  padding-left: 40px;
    padding-right: 0;	
    width: 65%;
}
.product_group:before{
	content: '';
	display: block;
	position: absolute;
	top: 45%;
	left: 0%;
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent; 
	border-right:10px solid #eeeeee; 
	margin-left:-10px;
	z-index:10000px;
}