Ciao a tutti! Ho un problema con le png su una pagina. Dovrei rendere delle png trasparenti su explorer, ma queste sono contenute in un iframe. Dovrebbe essere quindi trasparente anche quest'ultimo. Per fare queste cose vorrei ricorrere al filtro per explorer, perchè vorrei realizzare il sito esclusivamente in HTML e CSS, senza ricorsi a js o altro.

Il risultato che vorrei è più facile vederlo che spiegarvelo: se aprite questo link:

http://www.melameno.me/html/storico/storico.html

con un qualsiasi browser che non sia explorer vedrete il risultato che voglio anche per questo maledetto IE.

Ho provato così:

codice pagina principale:

codice:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
        <head>
        <title>melameno.me - storico: com'e' cresciuto il mio piccino. </title>
        <meta name="description" content="voglia di web master - un webmaster come tutor" />
        <meta name="author" content="Alessandro Petitti" />
        <meta name="keywords" content=" melameno, melameno.me, storico sito, webmaster, sviluppo web, grafica, photoshop, illustrator, indesign, seo, comunicazione integrata, web developement, web culture, cultura web, suggerimenti web, tutor webmaster" />
        <link rel="stylesheet" type="text/css" href="../../css/generale.css">
        <link rel="stylesheet" type="text/css" href="../../css/storico.css">
        <link rel="shortcut icon" href="favicon.ico">
        </head>

            <body>
              <div id="main">
                <div id="casapagina">
                 [img]../../img/casapagina.jpg[/img] 
                </div>
                <div id="imac">
                [img]imac.png[/img]
                <map name="date">
                <area shape="rect" coords="16, 10, 125, 38" href="13-05-11/frames/tastiera.html" target="tastiera">
                <area shape="rect" coords="16, 50, 130, 78" href="24-06-11/frames/tastiera.html" target="tastiera">
                </map>
                </div>
                <div id="schermi">
                <div id="tastiera">
                <iframe name="tastiera" target="schermo" src="13-05-11/frames/tastiera.html">
                </iframe>
                </div>
                <div id="screenshot">
                <iframe name="schermo" src="13-05-11/frames/1.html">
                </iframe>
                </div>
                </div>
               
              </div>
            </body>

</html>
Codice CSS:
codice:
#imac { position: absolute;
		z-index:2;
		width:1100px;
		left:0px;
		top:80px;}	
#tastiera { position:absolute;
			z-index:4;
			left:0px;
			top:315px;}
#tastiera iframe { width:440px;
				   height:130px;}
#screenshot iframe {width:880px;
					height:420px;}
#schermi { position:absolute;
		   left:197px;
		   top:90px;
		   z-index:3;}
E infine codice di un iframe con CSS inline (il primo, ma la faccenda è identica per tutti)
codice:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
        <head>
        <title>melameno.me - storico: com'e' cresciuto il mio piccino. </title>
        <meta name="description" content="voglia di web master - un webmaster come tutor" />
        <meta name="author" content="Alessandro Petitti" />
        <meta name="keywords" content=" melameno, melameno.me, storico sito, webmaster, sviluppo web, grafica, photoshop, illustrator, indesign, seo, comunicazione integrata, web developement, web culture, cultura web, suggerimenti web, tutor webmaster" />
        <!--[if lte IE 8]><link rel="stylesheet" type="text/css" href="../../css/storicoie.css">
        <style type="text/css">
        div#immagine {display:block;
			  width:800px;
			  height:400px;
    		  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/1.png')}
		div#immagine img{width:800px;
						 height:400px;
    					 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); }
        </style>
        <![endif]-->
        <style type="text/css">
		img {border:0;}
		</style>
        </head>
        <body>
 				<div id="immagine">
                [img]../img/1.png[/img]
                </div>
        </body>

</html>
Non so bene dove sbaglio, ma una cosa è certa: Sbaglio.