Compatibilità di un css con Internet Explorer.

[z3ro]

Ciao a tutti, questo è il mio primo post anche se questo sito/forum lo seguo da un bel pò!

Mi auguro che riusciate ad aiutarmi perchè è da due giorni che sto sbattendo la testa su questo script.

Vi spiego velocemente come funziona: Prendendo un forum in phpbb ho aperto la pagina overall_header.tpl (dentro la cartella /templates/SubSilver/)

Nella parte del css ho aggiunto questo codice:

div#banner {
    margin-top: -50px;
    margin-left: -250px;
    left:50%;
    top:50%;
    background-color:#fafafa;
    border:1px solid #66CCFF;
    padding:5px;
    text-align:center;
    font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;   
	display:none;
}

Mentre poco più sotto, nella parte prima della chiusura di </head> ho inserito questo javascript:

<script>
function enquete () {
var lf = "\n";
var CookieName='banner'
var CookieString = document.cookie;
var CookieSet = CookieString.split (';');
var SetSize = CookieSet.length;
var CookiePieces
var ReturnValue = "";
var x = 0;
for (x = 0; ((x < SetSize) && (ReturnValue == "")); x++) {
CookiePieces = CookieSet[x].split ('=');
if (CookiePieces[0].substring (0,1) == ' ') {
CookiePieces[0] = CookiePieces[0].substring (1, CookiePieces[0].length);
}
if (CookiePieces[0] == CookieName) {
ReturnValue = CookiePieces[1];
}
}
if(ReturnValue=="") {
	var e=document.getElementById('banner');
	e.style.display = "block";
	e.style.position = "fixed";
	e.style.float = "left";
	}
else {
	var e=document.getElementById('banner');
	e.style.display = "none";
}
}

</script>

Questo script funziona in questo modo: se è presente il cookie "banner" il display di div#banner sarà = "none" altrimenti, se il coookie non è presente sarà display=block, position=fixed, float=left.

ovviamente nel body della pagina ho messo onLoad="enquete();" per far partire la funzione.

Il problema sorge ora: con Firefox tutto perfetto. Con Internet Explorer (che sappiamo tutti com'è programmato ) il div#banner compare in alto senza tutte le proprietà che gli ho impostato (position, float, left, top...).

Come risolvo questo problema?

P.S su un altro sito avevo utilizzato un hack composto di js e css che sistemava questi problemi ma ora non sembra funzionare (per capirci lo script è questo: http://dean.edwards.name/IE7/)

Grazie per l'aiuto

[ilario83]

non so se ho capito bene, ma IE non supporta position: fixed, e non considera bene neanche top: n%; e left: n%; che li dovresti sostituire con margin-top: ...; e margin-left: ...;

Per position: fixed; mi sa che l'unico espediente sia darli la formattazione dello stile tranìmite javascript...

in bocca al lupo.