Problème de transparence d'un divRésolu/Fermé

Question

Bonjour, Je souhaite rendre le background d'un div transparent : Le CSS : #mon_div{background:black url(../image/mon_image.jpg);background-repeat:no-repeat;filter:alpha(opacity=30);-moz-opacity:0.3;-khtml-opacity:0.5;opacity:0.3; Jusque là pas de soucis.... Il faut que je mette du contenu dans cette div, dans des balises

etcetc Mon problème est que le contenu est lui aussi transparent, du coup on y voit pas grand chose.... j'aimerais éviter d'avoir la transparence sur mon contenu, sans avoir a retravailler l'image, en le réglant en css... est-ce possible svp? Merci d'avance pour votre aide :)

papymucho · Answer

Bon en fait je me suis mal expliqué... Là c'est normal que ça ne marche pas, puisque l'opacity est géré pour toute la div...

Ma question est comment géré l'opacity uniquement pour le background de la div.

Marcie :)

papymucho · Answer

up..

txiki · Answer

Salut a tous,
Pourquoi ne pas essayer de completer ta CSS comme ceci (note que je reviens toujours à la ligne pour aérer le code, c'est bien plus lisible):

#mon_div { /* arrière plan transparent */
  background:black url(../image/mon_image.jpg);
  background-repeat:no-repeat;
  filt­er:alpha(opacity=30);
  -moz-opacity:0.3;
  -khtml-opacity:0.5;
  opa­city:0.3;

Et ajouter ceci:

#mon_div p { /* le paragraphe du div ne sera pas transparent */
  font-family: verdana;
  font size: 12px; /* ou 1.0em, taille relative */
  color: #000000; /* pour le noir */
}

En espérant que ça t'aidera ! (j'ai pas essayé !

Le bonheur est la seule chose que l'on peut donner sans l'avoir.

papymucho · Answer

Sympa ta signature ^^

Pour les retours à la ligne, je le faisais avant... maintenant j'ai l'habitude comme cela ;-) Les fichiers css sont moins long, tu accèdes a ton élément directement. Si tu gardes la même structure a chaque fois, tu sais ou chercher pour trouver l'attribut désiré.

Sinon, malheureusement ça ne fonctionne pas....

En fait c'est dès que je met un div ou une image avec une opacité, et du texte par dessus même dans une autre balise (div, p, table etcetc) l'opacité est prise en compte également, même en paramétrant une z-index supérieure, position absolute etcetc... 

Personne n'a une idée? Ou il faut retravailler l'image? Ce qui ne m'arrange pas, car je gère l'opacité sur des animations.

txiki · Answer

Ouais, c'est un dicton basque !

Et t'a pas essayé de mettre un div dans un div ?
Avec un identifiant pour chacun bien sur !

papymucho · Answer

Oui j'ai essayé... Bah en fait c'est bon je viens de trouver.

J'ai mis un div avec une balise img dedans. Je gère la transparence en javascript sur l'image pour mon animation.
Puis un autre div apparait par dessus le premier, avec mon contenu...

Le problème est toujours là, mais moindre... j'ai baissé l'opacité etcetc... Du coup on y voit mieux...
Mais il doit bien y'avoir une solution correct quand même.

En tout cas merci :)

Problème de transparence d'un div

6 réponses

Discussions similaires

Newsletters