[resolu] Ombre portée CSS avec IE

Bonjour,

Une fois de plus je me tourne vers vous et bous remerçie par avance de l'aide que vous pourrez m'apporter.

Je souhaite afficher une ombre portée sur un container centré sur un fond coloré. Tout fonctionne parfaitement et le rendu est parfait, sauf avec IE.

.ombrage_boite
{
	-moz-box-shadow: 8px 8px 10px #666;
	-webkit-box-shadow: 8px 8px 10px #666;
	box-shadow: 8px 8px 10px #666;
	/* pour IE */
       filter:progid:DXImageTransform.Microsoft.Shadow(color=#666666, Direction=135, Strength=12); 
       zoom: 1;
}

Au chargement de la boite sous IE, l'ensemble du texte qu'elle contient se trouve affecté par une ombre portée, est-il possible de n'avoir l'ombre que pour le contenant et pas pour le contenu ?

Je vous remerçie
Modifié par lmbbb (11 Jan 2010 - 19:16)

Bonjour,

Deux choses:

- Tu utilises le filtre Shadow. Il existe un filtre DropShadow. Ce ne serait pas ce dernier qui t'intéresse? Cf. MSDN pour les détails.
- La syntaxe CSS utilisée n'est pas valide en CSS, et pas compatible avec IE8. Il faut utiliser la propriété -ms-filter, et la valeur doit être encadrée par des double quotes. Faire une recherche pour en savoir plus.

Je vous remerçie pour votre aide. Effectivement, c'est beaucoup mieux pour l'ombre . Mais un autre probleme arrive ...

.ombrage_text
{
	text-shadow:30px 30px 0 #666;
	/* pour IE */
	-ms-filter: 'progid:DXImageTransform.Microsoft.dropshadow(color=#666666, offx=30, offy=30)';
	zoom: 1;
}

avec firefox le resultat est exactement celui attendu :



mais avec IE :



ce n'est pas trop visible sur l'image, mais avec IE il y a une forte pollution du texte à ombrer. Des pixels noirs apparraissent

Je vous remerçie de votre aide.

Notes en vrac:
- Pas besoin de cédille à «remercie».
- La propriété -ms-filter est nécessaire pour IE8, mais pour IE 6-7 il faudra utiliser filter.
- Il ne faudrait pas utiliser Shadow pour les ombrages de texte et DropShadow pour les ombrages de blocs? À voir en lisant la documentation de Microsoft sur MSDN.
- Les filtres DirectX dans IE sont connus pour mettre le bazar dans le rendu du texte et causer divers désagrément. Pour ma part, je les évite.