ie fa cose strane con le proprietà del bordo quando uso un array per i colori :master: con mozilla fila liscio

provate questo:
<html>
<head>
<title>Untitled</title>

<style type="text/css">
#IeCarogna {width:60%;
height:40%;
background:silver}
p {cursorointer;
display:inline;
background:fuchsia;
}

</style>
<script type="text/javascript">
colori=new Array ('#123456','#abcdef')
function Bordo1 (pri){
var ciccio=document.getElementById('IeCarogna');
ciccio.style.border='4em solid'+colori[pri];
}

function Bordo2 (pri){
var ciccio=document.getElementById('IeCarogna');
ciccio.style.borderStyle='solid';
ciccio.style.borderWidth='4em';
ciccio.style.borderColor=colori[pri];
}
function Bordo3 (){
var ciccio=document.getElementById('IeCarogna');
ciccio.style.border='4em solid #dcdefa';
}
</script>
</head>
<body>
<div id="IeCarogna">
<p onclick="Bordo1(0)">così non funziona, </p>


<p onclick="Bordo2(1)">invece cosi sì </p>


<p onclick="Bordo3()">e così pure </p>
</div>
</body>
</html>

per non parlare di opera


spiegazione?