5568 sujets

Sémantique web et HTML

Bonjour,

J'ai une boite div qui est avec opacity=80 et des images transparent par-dessus. Pourquoi dans ie8 elle ne sont pas transparentes mais avec un background blanc.

Voici le code css et html.

* { margin: 0; padding: 0; }
body {font: 14px Helvetica, Sans-Serif; } 
#page-wrap {width: 1000px; margin:0 auto; overflow:hidden;} 
a { text-decoration: none;}
ul { list-style: none; }
p {
	margin: 15px 0;
	font-size: 13px;
	color: 666666;
}
#contenu {padding-top:50px;} /* le contenu commence a 49px en dessous du menu */


#texte { 
position:absolute;
	top:50px;
	padding: 40px ;
background-color:#fff;
width: 460px;
-moz-opacity:.80;
opacity:.80;
filter:alpha(opacity=80);
margin-left:40px;
}

ul.print {background:url(../images/filet.gif) no-repeat 0 1px; overflow:hidden; padding-left:3px;}
ul.print li {background:url(../images/filet.gif) no-repeat 100% 1px; float:left; padding-right:3px;}
ul.print li a {display:block; opacity:.80;}
ul.print li.imp a {background:url(../images/print-of.gif) no-repeat; height:35px; position:relative; width:40px;}
ul.print li.imp a:hover {background:url(../images/print-on.gif) no-repeat; height:35px; width:40px;}
ul.print li.imp a span {color:#000; display:none; text-decoration:none;}
ul.print li.imp a:hover span {display:inline; padding:10px; overflow:auto; position:absolute; left:97px; top:0; width:300px; z-index:2;}

ul.print li.ami a {background:url(../images/mail-of.gif) no-repeat; height:35px; position:relative; width:40px;}
ul.print li.ami a:hover {background:url(../images/mail-on.gif) no-repeat; height:35px; width:40px;}
ul.print li.ami a span {color:#000; display:none; text-decoration:none;}
ul.print li.ami a:hover span {display:inline; padding:10px; overflow:auto; position:absolute; left:50px; top:0; width:300px; z-index:2;}

h1 {
	color: 993300;
	font-size: 22px;
	font-weight: lighter;
}




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	
	
	<title>Simple jQuery Dropdowns</title>
	
	<link rel="stylesheet" href="css/style-f.css" type="text/css" media="screen, projection"/>
    <!--[if lte IE 7]>
        <link rel="stylesheet" type="text/css" href="css/ie.css" media="screen" />
    <![endif]-->
	
    		
	<script type="text/javascript" src="js/jquery-1.3.1.min.js"></script>	
	<script type="text/javascript" language="javascript" src="js/hoverIntent.js"></script>
	<script type="text/javascript" language="javascript" src="js/jquery.dropdown.js"></script>

</head>

<body>
<div id="page-wrap">


<DIV id="texte" class="texte">

  <h1>Pr&eacute;sentation</h1>
    
    <p>fahey+associés est une entreprise de consultation en urbanisme, en architecture de paysage, en design urbain, en développement immobilier, en aménagement du territoire et en équipements municipaux et de transport.</p>
    <p>Elle est à la tête d’une centaine de projets actuellement en cours en Amérique du Nord qui façonnent l’environnement urbain et améliorent les collectivités locales. Depuis le 1er mai 2009, fahey+associés fait partie du groupe CIMA+. </p>

<ul class="print">
<li class="imp"><a href="#"><span>Imprimer cette page</span></a></li>
<li class="ami"><a href="#"><span>envoyer à un ami</span></a></li>
</ul>

</div>


<div id="contenu">
<img src="images/firme.jpg" width="1000" height="666" alt="" />
</div>

</div>

</body>

</html>

upload/16393-erreur-bac.jpg upload/16393-mail-of.gif
Modifié par britanicus75 (26 Sep 2009 - 23:23)
"britanicus75" a écrit :
Pourquoi dans ie8 elle ne sont pas transparentes mais avec un background blanc.

Il n'y a pas que dans ie8. Rien qu'en regardant l'image mise sur ton post, sous Firefox ça le fait aussi.

En chargeant ton image sous Gimp, je ne vois pas de zone transparente mais bien du blanc à la place.