28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous, je cherche a faire un ombre sur un div, enfet c'est mon div global fonds blanc

j'ai chercher sur le net des infos a propos d'un effet ombre sur un contenu que j'ai ...
mais j'ai trouvré beaucoup avec des jeux d'image, ombre-1.png ...

il y'a moyen de faire juste une propriete css qui permet de faire ça ?
sans devoir jouer avec des images ?

Si mon fonds était blanc ou d'une couleur uni, simple l'astuce des images sera passer sans probléme

mais j'ai un fonds degrader donc si je met en png mon ombre il y'aura comme un probleme vous voyez ce que je veux dire ?

quelqu'un a une astuce ou solution ?
merci d'avance
bon lundi !
Modifié par IVIedia (09 Jun 2008 - 15:20)
Bonjour, aurais-tu un site ou une screenshot pour illustrer la situation ?
Si j'ai bien compris ..

Tu peux tout à fait enregistrer ton dégradé sur un calque vide et enregistrer ce dernier au format PNG.
C'est un technique éprouvée qui présente le problème cependant de ne pas fonctionner sous IE6 (et versions antérieures).

Exemple ici : http://andreloconte.com/blog/ (lors du survol des éléments du menu)
L'image de mon background est ici : http://andreloconte.com/blog/design/images/menu-background.png
Bonjour,

IVIedia a écrit :
il y'a moyen de faire juste une propriete css qui permet de faire ça ?
sans devoir jouer avec des images ?

Non.

IVIedia a écrit :
mais j'ai un fonds degrader donc si je met en png mon ombre il y'aura comme un probleme vous voyez ce que je veux dire ?

Tu veux dire un problème avec IE6?
Auquel cas, tu offres un rendu nickel dans tous les navigateurs modernes, et pas d'effet d'ombre pour Papy IE6. Et c'est réglé. Smiley smile
Bonjour Akhilleus, c'est vrai que avec du png sous IE7 et FF pas de probléme je peux aussi faire un cs qui dit de mettre le global avec ombre pour IE7 & FF et pour IE6 pas d'ombre je pense que c'est fesable ça Smiley smile

L'image sans ombre :ici
L'image avec ombre :ici

Je suis entrain de refaire un skin pour phpBB3 Smiley smile

Merci, bonne journée
Florent V. a écrit :
Bonjour,


Non.


Tu veux dire un problème avec IE6?
Auquel cas, tu offres un rendu nickel dans tous les navigateurs modernes, et pas d'effet d'ombre pour Papy IE6. Et c'est réglé. Smiley smile

je vient de lire ton message en effet je fait l'effet et pour IE6 je fait un autre css et ca passera Smiley smile
oui c'est fesable ça

Smiley smile
Notons que ce design est aussi intégrable sans utiliser le moindre effet de transparence. Il faudra juste avoir deux images pour le bloc central, une répétée en hauteur et l'autre d'environ 300-400px de haut et affichée juste sur le haut du bloc.

Par contre, ça demande d'utiliser deux blocs imbriqués au lieu d'un.
Salut Florent V., j'ai régler le probléme mais je doit trouvrer comment gerer dans phpbb pour dire que si c'est IE6 il doit prendre en compte style2.css

tu peux jeter un oeil la Smiley smile

ici

aplus
IVIedia a écrit :
Salut Florent V., j'ai régler le probléme mais je doit trouvrer comment gerer dans phpbb pour dire que si c'est IE6 il doit prendre en compte style2.css

Il faut que tu puisses générer un commentaire conditionnel dans le head des pages, commentaire avec un appel de la feuille de styles pour IE6. Attention, cette feuille de styles doit uniquement contenir des correctifs, et pas les styles complets du site corrigés pour IE6.

Pour les commentaires conditionnels, voir la FAQ du forum.

PS: un background: white sur #bodyline serait pas mal. Il ne faut pas trop se reposer sur les images de fond.
Modifié par Florent V. (09 Jun 2008 - 14:27)
:) Florent V. , excat je doit juste mettre ceux que j'ai besoin de modifier et non pas copier coller tout Smiley smile
la j'ai fait mais y'a quand un bug tu sais jeter un oeil la Smiley smile

ici
merci bien
Re à tous, c'est regler la Smiley smile ouff
cool ca marche d'enfer pour ceux qui n'ont pas IE7 ou ff tampis Smiley smile
lol

merci encore a vous tous !
vous pouvez jeter un oeil la

ici
a bientôt