le 29/10/2007 à 22:18
Div Transparente / Superposition
Hello
je cherche à créer une div avec un fond transparent et le texte lui opaque.
Pour cela (je me suis inspiré d'un tuto sur le site developer.mozilla.org)
le principe est d'avoir une div "conteneur" et à l'intérieur 2 div, une normale et l'autre transparente et qui contient le même texte (afin d'avoir exactement la même taille,vu que je ne connait pas la taille à l'avance : texte dynamique) qui sera superposée à la 1ère.
Le truc c'est que sur IE ca marche bien mais sur FF la div transparente est décalée ...
Voilà le code HTML :
et le code CSS :
Si vous voulez voir ce que ça donne allez dans le menu News sur mon site newsymphony.free.fr
Merci de votre aide
je cherche à créer une div avec un fond transparent et le texte lui opaque.
Pour cela (je me suis inspiré d'un tuto sur le site developer.mozilla.org)
le principe est d'avoir une div "conteneur" et à l'intérieur 2 div, une normale et l'autre transparente et qui contient le même texte (afin d'avoir exactement la même taille,vu que je ne connait pas la taille à l'avance : texte dynamique) qui sera superposée à la 1ère.
Le truc c'est que sur IE ca marche bien mais sur FF la div transparente est décalée ...
Voilà le code HTML :
<DIV class='NewsContent' id='DivNews1'>
<DIV class='NewsText'><p>bla bla</p><p>bla bla bla</p></DIV>
<DIV class='NewsBack'><p>bla bla</p><p>bla bla bla</p></DIV>
</DIV>
et le code CSS :
.NewsContent
{
position: relative;
}
.NewsText
{
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
}
.NewsBack
{
background-color: silver;
filter: Alpha(opacity=20);
-moz-opacity: .20;
-khtml-opacity: 0.20;
opacity: .20;
width: 100%;
height: 100%;
}
Si vous voulez voir ce que ça donne allez dans le menu News sur mon site newsymphony.free.fr
Merci de votre aide
