Problema compatibilità CSS

[ilgiaguaro]

Salve a tutti,
sto costruendo un sito avvalendomi di un CSS, Wordpress nello specifico.
Ho costruito un menù drop down e tramite i CSS ho impostato delle trasparenze alla barra del menù.
Adesso sono in fase di test ed ovviamente ho provato su vari browser.
Ed il risultato è il seguente:
Su Safari e Internet Explorer
http://img255.imageshack.us/i/safariwb.png/
Su Firefox, invece
http://img339.imageshack.us/i/firefoxwf.png/

Come si può ben vedere su Safari e IE mi fa vedere l'effetto di colore diverso al passaggio del mouse, su Firefox non funziona.

Ecco il codice dei CSS:

/* Dropdown Menu */		
#page-bar li {
	float: left;
	margin: 0px;
	padding: 0px;
	}
	
#page-bar li li {
	float: left;
	margin: 0px;
	padding: 0px;
	width: 122px;
	text-transform:capitalized;
	}
	
#page-bar li li a, #page-bar li li a:link, #page-bar li li a:visited {
	background: #3c78a7;
filter: alpha(opacity=85);
-moz-opacity:0.85;
opacity: 0.85;
	width: 122px;
	float: none;
	margin: 0px;
	padding: 5px 10px 5px 18px;
	border-top: 0px solid transparent;
	}
	
#page-bar li li a:hover, #page-bar li li a:active {
	background: #red;
	padding: 5px 10px 5px 18px;
	}

#page-bar li ul {
	position: absolute;
	width: 10em;
	left: -999em;
	}

#page-bar li:hover ul {
	left: auto;
	display: block;
	}
	
#page-bar li:hover ul, #page-bar li.sfhover ul {
	left: auto;
	}

Dove potrebbe stare l'errore?!
Altra cosa...nella barra laterale ho le intestazioni dei Widget che su Safari vengono viste regolarmente colorate, su Firefox invece no...si vede a destra dove c'è Trovaci su Facebook,
ecco il codice:

#sidebar-middle-second h3 {
	font:1.1em Arial;
	font-weight:bold;
	background:#a5cc3a;
background-image: url(http://www.xxx.xx);
	color:#20398c;
	margin:10px 0px 5px 0px;
	padding:3px 10px;
	}

Quale potrebbe essere la soluzione a questi problemi?!


Grazie mille per l'aiuto!

 

[Eliox]

Che versione di IE stai utilizzando?