Bonjour,
J'ai un petit casse-tête que je ne parviens pas à résoudre. Voilà, j'ai une div avec une image de fond en .png (avec transparence) dont le haut est un arrondi, c'est-à-dire que l'extérieur de l'arrondi est transparent. Jusque-là pas de problème. L'image continue ensuite en dégradé de couleur mais bien sûr elle a une fin. Comme cette div est amenée à recevoir plus ou moins de contenu, il arrive un moment où l'image de background n'est plus assez grande. Qu'à cela ne tienne, me dis-je, je vais mettre un background-color de la couleur du dernier pixel de mon dégradé comme ça quand la div sera plus grande que l'image de background ça enchainera sur le fond de couleur et zou ! Mais c'est sans compter la transparence du haut de la div qui dans ce cas laisse apparaitre la couleur de fond. :/
le site en question est , il s'agit du chapître "LES PROFS"
Any idea ?
Merci de votre aide…

2 réponses


Yentia
Réponse acceptée

Salut,

J'ai une solution qui peut être utile et qui je pense réduira également ton image. il s'agit de mettre ton image que sur le titre ( tu découpe ton image juste pour garder l'arrondi et que le titre passe dedans ), puis pour le reste du contenu tu fais ton dégradé en CSS3.

Bonne continuation

hatfab
Auteur

Super, ça fonctionne et c'est bien plus léger. Sauf qu'il faut que je le fasse pour tous les autres chapitres ;)
Merci !