Images avec transparence de background tronquées sur Opera et FF3

Bonjour à tous,

J'ai un problème que je n'arrive pas à régler et dont je n'arrive pas à trouver de cas similaires sur le web (j'avoue que j'étais un peu sec pour trouver des termes de recherche adéquats : /).

Voila je dispose d'une div qui constitue le corps de ma page, et dont le fond est un gif transparent sur les bords, mais dont la dimension correspond à la dimension de ma div.

Ceci ne pose aucune problème sur les navigateurs "classiques", mais sur FF3alpha5 et Opéra, la partie transparente de mon image de fond est "tronquée", et donne lieu à un "repeat" de l'image en question que je n'arrive pas à éradiquer, même avec des "background-repeat:no-repeat".

La page se trouve ici : http://www.fourmilia.net , regardez avec FF2 puis Opéra je pense que vous arriverez à vous faire une idée : /.

Un grand merci par avance parce que vraiment, je suis sec pour le coup ...


p.s. : j'ai lu les recommandation pour poster (je ne me suis pas attardé sur tous les mots pendant plus de 5 secondes pour chacun mais bon), mais je ne sais pas trop quelle est la politique du forum concernant les "pièces" à joindre, dites moi s'il me faut poster les images en question, etc.

Merci encore d'avance.

Bonjour,

Tu es sûr d'avoir bien mis les background-repeat à no-repeat pour les éléments concernés ? Ça n'a pas l'air d'être le cas, et il suffit que j'élargisse un peu un bloc pour voir l'image se répéter.

De même, tu as bien positionné tes images comme voulu avec la propriété background-position (ou via la propriété background, en donnant d'abord la valeur pour le positionnement horizontal puis la valeur pour le positionnement vertical ? Ça n'a pas l'air d'être fait non plus.

Et sinon, un petit coup de validation pour se rendre compte que float: center ça n'existe pas.
http://jigsaw.w3.org/css-validator/

J'ai modifié tout ce que tu m'as dit, que j'avais testé auparavant, et toujours la même chose ... je ne sais pas si tu vois ce qui se passe au niveau de mes images : ces dernières sont en fait de la largeur de la div, mais sont tronquées dans les zones ou elles sont transparentes (tu peux voir les images : http://fourmilia.net/styles/themes/basic_advanced/pictures/bg_frame.gif et http://fourmilia.net/styles/themes/basic_advanced/pictures/banniere.gif, tu comprendras mieux).

Donc est-ce une nouvelle spécification ? ou encore un bug de cairo (ca utilise cairo aussi opéra non ?).

Merci d'avance encore une fois ...

Taku a écrit :
ca utilise cairo aussi opéra non ?

Il me semble que non.

Sinon :

div#main {
	background		: url(pictures/bg_frame.gif);
	background-position: top right;
	background-repeat: repeat-y;
}

Comme dit dans mon précédent message, il faut donner « d'abord la valeur pour le positionnement horizontal puis la valeur pour le positionnement vertical » lorsque l'on utilise la propriété background-position.

Mais bon, je doute que ça vienne de là.

D'ailleurs, je viens de m'esquinter les yeux sur ces fichiers CSS interminables (wow... ya du monde là-dedans...), faire quelque tests, mais rien de probant. Je passe donc la main, au moins pour ce soir.

C'est très gentil à toi en tout cas de t'y être penché, vraiment merci.
Je ne vois pas trop ce que je peux faire maintenant mais bon ... on va dire qu'on va laisser cela ici pour le moment ... ça sera pour la prochaine version si personne ne trouve. Merci encore.

Taku a écrit :
Je ne vois pas trop ce que je peux faire maintenant mais bon ...

1. Faire une page de test minimale pour tenter de reproduire le problème.
2. Rogner les images pour virer la partie transparente de gauche, et les positionner via background-position. Par exemple si on veut laisser 37px de vide à gauche : background-position: 37px top;.

Bon bah j'ai redécoupé les images et le site finalement, ca prenait moins de temps que de chercher le pourquoi du comment .

Merci beaucoup pour ton aide Flo.