Ajouter de l'ombrage sur le cadre des avatars

[Dixon]

Bonjour!^^
Alors voici mon problème:
J'ai créé un contour autour des avatars sur ma feuille CSS et il fonctionne très bien, mais j'aimerais avoir un ombrage sur le cadrage. J'aimerais donc modifier le code CSS pour avoir le résultat avec ombrage. Est-ce possible et si oui, comment? Un énorme merci à la personne qui me répondra! =)

Voici mon code CSS pour le cadrage :

Code:

 /* CONTOUR AVATAR */

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border: 10px solid #77b2b9;
}

[Invité]

Bonsoir,
Essayez avec ceci:

Code:


.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border: 10px solid #77b2b9;
-moz-box-shadow: 8px 8px 8px #000;}

Cordialement.

[Dixon]

Bonjour!^^ J'ai essayé le code proposé et ça ne fonctionne pas. J'ai Google Chrome et je ne vois pas de différence, ni sur Opéra, ni sur Explorer. est-ce que ce genre de code ne fonctionne qu'avec Mozilla Firefox?

[Invité]

Bonjour,

Oui le code que j'ai donné ne fonctionne que pour firefox. J'ai réussi à obtenir l'affichage sous Opéra11.

Code:

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border-bottom-left-radius:15px;
border-bottom-right-radius-:15px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border: 10px solid #77b2b9;
-moz-box-shadow: 8px 8px 8px #000;
box-shadow: 8px 8px 8px #000;}

Cordialement.

[kalyon]

Bonjour,

Oui le code que j'ai donné ne fonctionne que pour firefox. J'ai réussi à obtenir l'affichage sous Opéra11.

Code:

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border-bottom-left-radius:15px;
border-bottom-right-radius-:15px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border: 10px solid #77b2b9;
-moz-box-shadow: 8px 8px 8px #000;
box-shadow: 8px 8px 8px #000;}

Cordialement.

Faux ! ^^

Voici le code pour firefox, chrome et opéra normalement :

Code:

 /* CONTOUR AVATAR */

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border: 10px solid #77b2b9;
-moz-border-shadow: #000 0px 0px 8px;
-webkit-border-shadow: #000 0px 0px 8px;
-border-shadow: #000 0px 0px 8px;
}

Si l'ombre ne fonctionne pas sous opéra, essayer d'enlever le " - " du début de " -border-shadow: " !

Normalement, ça devrait fonctionner

[Invité]

Bonjour,

Avant de poster, je m'assure toujours que mon code fonctionne. Il est vrai que j'ai laissé un malheureux" - " de trop à la fin d'un radius. Mais le code que j'ai donné fonctionne sous opéra et firefox.

capture du résultat:

Pour ce qui est d'IE, je n'ai que IE8 qui ne veut rien entendre en terme de CSS ... et pour chrome, je ne parviens toujours pas à obtenir l'ombre.

Cordialement.

[Dixon]

Oooooh merci!!!! Tu me sauves tellement la vie!
Ça fonctionne super bien! T'es trop génial! Merci encore! <3

[kalyon]

Bonjour,

Avant de poster, je m'assure toujours que mon code fonctionne. Il est vrai que j'ai laissé un malheureux" - " de trop à la fin d'un radius. Mais le code que j'ai donné fonctionne sous opéra et firefox.

capture du résultat:

Pour ce qui est d'IE, je n'ai que IE8 qui ne veut rien entendre en terme de CSS ... et pour chrome, je ne parviens toujours pas à obtenir l'ombre.

Cordialement.

Bonjour,

Je ne m'adressais pas a toi concernant le " - ", je parlais de mon code a moi

Edit: en effet, il y as un " - " de trop dans ton code, c'est un pur hazard, je ne l'avais même pas remarqué ^^