28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai sur cette page de test mis en place un peu de transparence mais cela débloque sur IE.
Pourriez-vous m'aider à y voir plus clair ?
Merci
Dan

La page en question : http://www.phonethik.com/spip.php?page=une

Le css utilisé pour cette transparence :

.img-desc {
	position: relative;
	float: left;
}
.img-desc p {
	float: left;
	background: #111;
	-moz-opacity:.75;
	filter:alpha(opacity=75);
	opacity:.75;
	color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 5px 0;
	margin: 0;
	border-top: 1px solid #999;
}
.img-desc p span {
	float: left;
	padding: 5px 5px;
}


La partie HTML (et spip)

<BOUCLE_titres1(ARTICLES){id_rubrique=38}{par date}{inverse}{0,15}>
				<div class="surtitre2"><font color="#8b0000">#SURTITRE</font><font size="-3" color="gray"> </font><font size="-3" color="black">-</font><font size="-3" color="gray"> [(#DATE|jour)].[(#DATE|mois)].[(#DATE|annee)]</font></div>
				<div class="titre3"><a href="#URL_ARTICLE"> #TITRE</a></div>
				<div class="img-desc">[(#LOGO_ARTICLE_RUBRIQUE|left||reduire_image{635,0}|image_recadre{635,200})]
				<p><span><div class="soustitre">#SOUSTITRE</div></p></span></div>
				<div class="chapo">#INTRODUCTION</div>
<br>
</BOUCLE_titres1>

Modifié par Florent V. (17 Feb 2009 - 17:48)
Une question... Pourquoi utiliser un padding dans le p et un padding dans le p span ?
Bonjour Temana,

Merci d'utiliser les balises prévues à cet effet, pour mettre en forme votre code s'il vous plait
[ code]Ici votre code[ /code]<- sans espace après chaqu crochet ouvrant

Et pour info :
a écrit :
Depuis Mozilla 1.7, la propriété CSS 3 opacity est correctement supportée. Avant Mozilla 1.7, -moz-opacity a été implémentée de façon différente, comme une propriété héritée. Il faut préférer l'utilisation de opacity à -moz-opacity.

En fait il me semble même que c'est inutile depuis FF 0.8 ou 0.9 Smiley cligne

Cdt,
Sylvain
Bonjour,

Merci pour vos réponses

Bon visiblement il y avait un problème de div. J'ai juste enlevé la class liée au soustitre et cela fonctionne.

bonne fin de journée
Bonjour,

C'est très bien d'avoir marqué ce sujet comme résolu, mais ça aurait encore mieux de tenir compte des remarques de 6l20 et de corriger ton message pour mettre en forme les blocs de code. Bon, là je l'ai fait, mais penses-y à l'avenir; tu admettras que ça facilite la lecture des messages.