28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai 2 questions sur les dégradés en CSS, la FAQ ne m'a pas apporté de réponse.

1/ Voir upload/1010-css1.jpg

Le code du titre est :

html body div#contenu h1 {
	width : 90%;
	margin-bottom : 10px;
	padding : 3px;
	font-size : 1.1em;
	background : url(./images/degrade_h1.png) top left;
	background-repeat : repeat;
	color : rgb(0, 0, 0);
	background-color : rgb(200, 200, 200);
}


Or, le fait de spécifier un wifth en pourcentage répète le début de l'image sur sa droite. Je ne veux pas mettre de valeur fixe pour m'adapter aux résolutions plus grandes (même si mon image a déjà une valeur fixe...)

Solution : background-repeat : repeat-y;

2/ Le même titre, sous IE6 :

upload/1010-css2.jpg

Le dégradé se termine en transparent. Or on voit nettement que le gris de fin d'image n'est pas le même que le gris de fond. Existe-t-il une solution pour les harmoniser ? Ou bien il faut juste prier pour IE6 soit vite abandonné au profit de son petit frère ? Smiley biggrin

Solution : Créer le .png avec Gimp (ou autre) qui ne salit pas l'image

Merci d'avance pour vos conseils.

Jarodd
Modifié par Jarodd (05 May 2007 - 17:56)
J'ai trouvé une réponse à la première question ! Il suffisait de mettre background-repeat : repeat-y; Smiley confused

Mais rien à faire pour la 2e... Ie ne comprend pas les couleurs Smiley biggol
Jarodd a écrit :
Mais rien à faire pour la 2e... Ie ne comprend pas les couleurs Smiley biggol

Il ne faut pas enregistrer la correction gamma lorsque tu crées ton image PNG. Si tu travailles avec Photoshop, sache que ce logiciel gère très mal le PNG. Il faudra soit passer par un logiciel tel que TweakPNG, ou un éditeur différent comme The Gimp (très bonne version du PNG).
Tu peux utiliser pngOUT qui en plus d'optimiser ton image, supprime le
gamma responsable de l'assombrissement du png sous IE.