Sfondo png non corretto su IE

[nibbles]

L'intestazione del mio sito è contenuta in un div al quale applico uno sfondo in png con sfondo trasparente. In FF tutto ok mentre in IE al posto della trasparenza si vede grigio. come posso evitare questo problema? Devo mantenere la trasparenza perchè visualizzo lo sfondo del body sotto alla mia png dell'intestazione. Grazie,

[fcaldera]

posta il frammento di codice css/html che non va


P.s. sarà un caso ma penso ad Agna in continuazione... segno del destino?

[nibbles]

HTML:

<div id="contenitoreSito">
	<div id="intestazione"></div>
</div>

CSS:

body,td,th {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}

body {
	background-color: #0044ab;
	background-image: url(../Images/sfondo.png);
	background-repeat: repeat-x;
	background-position: top;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
}

div#contenitoreSito{
	width: 770px;
	margin: auto;
}

div#intestazione {
	background-image: url(../Images/intestazione.png);
	background-position: top center;
	background-repeat: no-repeat;
	padding-top: 50px;
	height: 55px;
}

Cosa vuol dire che pensi ad Agna in continuazione?

[fcaldera]

non funziona su IE perchè devi usare il filtro Alphaimageloader per IE 6 e 5.5
puoi vederne un esempio qui http://www.fabriziocalderan.it/bg_png/bg2.html (sorgente della pagina)

Inoltre su IE bisogna ricorrere ad un hack caricando anche una gif trasparente


P.s.
Niente, conosco una persona che abita lì da te che lavorava con me... e ci stavo proprio pensando poco prima di leggere il tuo post

[nibbles]

Grazie mille della dritta, il filtro che applichi se lo preleva dalla rete o è insito in una dll di sistema?
Funziona anche con IE 5, 5.5, 7?

[fcaldera]

il filtro è integrato nel browser. Lo puoi usare in IE 5.5+

Di fatto IE 7 supporta le png trasparenti di sfondo quindi tramite opportuno commento condizionale puoi applicare il filtro a IE 5.5 e IE 6

[nibbles]

Scusami se ti rompo ma le condizioni nei CSS non le ho mai usate. Io inserisco questo codice nel file CSS e non nell'html, ma credo sia la stessa cosa.

<!--[if lte IE 6]>
	<style type="text/css">
    #intestazione {
	background-image: url(../Images/bg100.gif);
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../Images/intestazione.png", sizingMethod="scale");
    }
    </style>
<![endif]-->

Funziona anche se lo applico all'id del livello come nel mio casa o solo al class?
Come faccio nello stesso if ad includere i due IE?

Grazie della pazienza,

[fcaldera]

Originariamente inviato da nibbles
Scusami se ti rompo ma le condizioni nei CSS non le ho mai usate. Io inserisco questo codice nel file CSS e non nell'html, ma credo sia la stessa cosa.

No.
Non è la stessa cosa, non puoi usare quella sintassi in un file css esterno

<!--[if lte IE 6]>
<style type="text/css">
    #intestazione {
	background-image: url(../Images/bg100.gif);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../Images/intestazione.png", sizingMethod="scale");
    }
    </style>
<![endif]-->

Funziona anche se lo applico all'id del livello come nel mio casa o solo al class?

va bene lo stesso

Come faccio nello stesso if ad includere i due IE?

<!--[if lte IE 6]> significa "se Explorer è minore o uguale a 6"

Presta molta attenzione ad un dettaglio MOLTO importante: quando scrivi

...AlphaImageLoader(src="../Images/intestazione.png"...

il percorso da settare all'attributo "src" non è relativo a partire da dove si trova il css, ma relativo a dove si trova il file html che lo include, chiaro?

Ciao

[fcaldera]

comunque cerca tra i link utili in evidenza "commenti condizionali" (oppure "conditional comments)
in modo da capirne il funzionamento.

[nibbles]

Con le tue dritte sono riuscito a far funzionare il tutto anche su IE. Xò mi ritorvo con due problemini...

Il primo non riesco a dargli il percorso relativo se i due file si trovano in un'altra directory.

se il mio .html si trova in c:\directory\file.html e le due img si trovano in c:\directory\directory2\img1.png e bg100.gif che indirizzo relativo devo dare? Io ho provato con ../directory2/img1.png e bg100.gif e nn funziona e poi ho provato con directory2/img.png e bg100.gif ma non funziona ancora. forse devo farmi restiuire l'indirizzo assoluto fino al .html e poi aggiungere il relativo, ma nn so come.

Il secondo problema è che in IE ti trovi sempre l'avviso che ti blocca lo script e ti chiede se vuoi eseguirlo. E' possibile ovviare? Grazie,