Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: awcbg le le 15-08-2009 a 03:44:06

Titre: conteneur div id class et transparence PNG
Posté par: awcbg le le 15-08-2009 a 03:44:06

Bonjour a tous, je viens vous exposer ma prise de tete !!
J'ai fait des div qui se superpose pour avoir des bord arrondis (je sais y'a d'autres manieres de faire, mais c'est celle la qui convient le mieu pour ce site), Le hic c'est que mes background-image sont des png avec effet de transparence (volontaire) et du coup, tout se superpose et je n'ai pas mes bordure arrondis :(
Je suis pas un pro a CSS, donc j'voulais savoir si il y avait une maniere pour annuler le background-image parent dans une id enfant avec un autre background-image...
Ou du moins que l'enfant soit la seule visible et pas la parent !
Mon code se presente comme ça:

HTML:
<div class="fond"><div id="hd"><div id="hg"><div id="bd"><div id="bg"></div></div></div></div></div>

CSS:
div.fond {background:url(images/fond.png) repeat; }
#hg {background:url(images/hg.png) no-repeat top left; }
#hd {background:url(images/hd.png) no-repeat top right; }
#bd {background:url(images/bd.png) no-repeat bottom right; }
#bg {background:url(images/bg.png) no-repeat bottom left; }

Titre: Re:conteneur div id class et transparence PNG
Posté par: tony35520 le le 16-08-2009 a 23:37:54

Tu peux faire apparaitre un background en priorité par rapport à un autre, grace a "z-index"...la div qui a la valeur 1 sera en dessous de la div qui a la valeur 2 etc...Pour cela il faut que tu travail avec des div en position absolu.

bon courage

Titre: Re:conteneur div id class et transparence PNG
Posté par: MarvinLeRouge le le 18-08-2009 a 22:44:23

Salut,

Malheureusement, le z-index ne te sera pas ici d'une grande utilité : que tu mettes A au dessus de B ou B au dessus de A, tu superposes toujours 2 images transparentes.

L'effet souhaité peut peut-être se faire avec la propriété clip, mais je ne te serai pas d'une grande aide sur celle-là.

En revanche, si la largeur de tes blocs est connue, le mieux serait peut-être tout simplement d'avoir un "top", un "main" (avec le fond se répétant en vertical), et un "bottom", l'un après l'autre dans le code, et éventuellement dans un wrapper (un div d'emballage pour définir le bloc dans son ensemble.


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.