| Mettre un contour au profil et/ou à l'avatar (messages) | |
|
|
buffytheone
{ Membre }
Messages : 20
| Merci pour ce tuto !!! =) j'ai essayé et ajouter d'autres modifications a mes profils mais ça rend super ! - Spoiler:
| | |
|
| |
Addiction
{ Membre }
Messages : 125
| VOici mon code : - Code:
-
.postdetails.poster-profile a img { -moz-border-radius-bottomleft:3px; -moz-border-radius-bottomright:3px; -moz-border-radius-topleft:3px; -moz-border-radius-topright:3px; border: 2px solid #A3A3A3; -moz-box-shadow: 0px 0px 5px #505050; -webkit-box-shadow: 0px 0px 3px #505050; box-shadow: 0px 0px 4px #505050; } et ça ne marche plus. >.< ça allait avant, mais maintenant, je ne sais pas, j'ai chipoté aux templates et ça ne va plus. Alors, j'ai remis le template de base, j'ai remis le code CSS et ça ne fonctionne toujours pas. Que faire ? | | |
|
| |
Minou
{ Membre }
Messages : 12
| Bon pour commencer, merci pour le tuto. J'ai juste une petite question, par contre. J'ai essayé de bidouiller le code, pour que le rang d'un joueur soit affiché comme le pseudo, à savoir entouré d'une bordure. - Spoiler:
Regardez le pseudo, et j'aimerais faire la même chose pour le rang. J'ai essayé déjà pas mal de choses, notamment ça : - Code:
-
<span class="rang"> blahblahblah</span> Ce qui donne : - Code:
-
<span class="postdetails poster-profile"><br /> <span class="rang">{postrow.displayed.POSTER_RANK}<br /><br /> {postrow.displayed.RANK_IMAGE}</span>{postrow.displayed.POSTER_AVATAR}<br /><br /> <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span><br /><br /> Ensuite, direction la feuille CSS, les codages habituels, mais ça n'a rien fait, et ça a même complètement détruit l'apparence de base du profil XD Donc j'ai effacé, et j'aimerais savoir si quelqu'un a une solution, parce que si ça a marché pour le pseudo, pourquoi pas pour le rang ? En outre, j'aimerais savoir si quelqu'un a une solution pour que la feuille de personnage, affichée dans le profil, soit elle aussi entourée d'une bordure rien qu'à elle. Voilà, j'ai tout mis en même temps dans le même sujet parce que c'est lié. Merci d'avance de vos réponses ^^ | | |
|
| |
Minou
{ Membre }
Messages : 12
| Ah, désolé du double post ( Je rêve ou on peut pas éditer ses messages ? Oo ), mais je viens de me rendre compte que la bordure que j'avais mis pour les pseudos s'affiche jusque dans la liste des sujets postés, et ça a un rendu affreux... moi je voulais juste l'afficher dans les profils des messages postés, et nulle part ailleurs XD
Donc si quelqu'un peut résoudre mon souci... | | |
|
| |
Morgane*
{ Membre }
Messages : 29
| Bonjour j'ai essayé ce code - Code:
-
.postdetails.poster-profile a img { border: 6px; SOLID ;#3C3C3C; /*La bordure*/ -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px;} Mais ça ne marche pas :/ Y a-t-il quelque chose qui cloche ? | | |
|
| |
Kory
{ Membre actif }
Messages : 370
| - Morgane* a écrit:
- Bonjour j'ai essayé ce code
- Code:
-
.postdetails.poster-profile a img { border: 6px; SOLID ;#3C3C3C; /*La bordure*/ -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px;} Mais ça ne marche pas :/ Y a-t-il quelque chose qui cloche ? Essaie ceci. Ce qui clochait c'était les points virgules dans l'attribut "border" - Code:
-
.postdetails.poster-profile a img { border: 6px SOLID #3C3C3C; /*La bordure*/ -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px;} | | |
|
| |
Morgane*
{ Membre }
Messages : 29
| Ça ne marche toujours pas :/ | | |
|
| |
Hiro
Ninja Codeur
Messages : 1179
| - Citation :
.postdetails.poster-profile a img { border: 6px; SOLID ;#3C3C3C; /*La bordure*/ -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px;} Pourquoi tout ces moz-border-radius , autant tout rassembler étant donné qu'ils ont la même valeur . Tu es sous quel navigateur ? | | |
|
| |
Morgane*
{ Membre }
Messages : 29
| Ah on peut les rassembler ? *jedébarqueBONSOIR* Sous mozilla | | |
|
| |
Hiro
Ninja Codeur
Messages : 1179
| Bah oui ^^ - Code:
-
.postdetails.poster-profile a img{ border: 6px solid #3C3C3C; /*La bordure*/ -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } Essaye avec ce code . | | |
|
| |
Morgane*
{ Membre }
Messages : 29
| Mon CSS ne doit pas m'aimer ça ne fonctionne pas :/ mais merci pour le code ! | | |
|
| |
sunn-shiinex
{ Membre }
Messages : 86
| Moi ca marche pas j'ai essaye des tonnes de code et ca fais rien ni sur mon forum test ni mon vrai forum? j'ai mis ce code mais ca change rien? - Code:
-
.postdetails.poster-profile a img { border: 6px; /*La bordure*/ } | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| Holà~ tu dois aussi ajouter un style de bordure (comme solid pour une simple ligne, dashed pour des tirets, dotted pour des points...) et une couleur :DD Par exemple, si tu veux une bordure avec une simple ligne de couleur noire tu vas mettre ce code: - Code:
-
.postdetails.poster-profile a img { border: 6px solid #000000; /*La bordure*/ } | | |
|
| |
sunn-shiinex
{ Membre }
Messages : 86
| Merci! après tout les code que j'ai essayer ya que le tien qui marche | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| xD Tu peux ouvrir un sujet d'aide avec les codes qui ne fonctionnent pas et on se fera un plaisir de t'aider :DD
Et de rien, ça fait plaisir ♥ | | |
|
| |
sunn-shiinex
{ Membre }
Messages : 86
| Désoler du DP.
merci ca marche pas je vien de me rendre compte ca marche pas avec les invité? comment je fait pour que ca marche pour invité aussi? | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| Après presque qu'une heure de recherches sur le Forum de Forumactif utiliser la fonction rechercher là-bas est horrible, y'a trop de messages je n'ai qu'une solution. MAIS~ Le contour va être là même si un membre n'a pas d'avatar . Donc, direction le template viewtopic_bodyIl faut aller chercher ce truc dans le template: - Code:
-
{postrow.displayed.POSTER_AVATAR} Ça c'est la balise Javascript de l'avatar dans les templates. Donc, on va entourer ce truc là d'une div avec une class qu'on va appeler contourava, tiens. Comme ça: - Code:
-
<div class="contourava">{postrow.displayed.POSTER_AVATAR}</div> Après ça on fait enregistrer, un clique sur le + vert pour publier le template, etc etc xD Et là, go dans le CSS. Tu vas prendre ton code CSS, celui-là (tu as peut-être changé la couleur mais bon xD) - Code:
-
.postdetails.poster-profile a img { border: 6px solid #000000; /*La bordure*/ } et tu vas remplacer .postdetails.poster-profile a img par .contourava, ce qui devrait donner ce truc: - Code:
-
.contourava { border: 6px solid #000000; /*La bordure*/ } Ensuite, tu fais enregistrer. Perso j'ai essayé avec des avatars 100*100 et le cadre est déformé un peu sur la largeur mais ça s'arrange en ajoutant width: 100px; dans le CSS (width pour largeur, 100px pour la largeur de l'avatar) Donc c'est une façon un peu plus "radicale" de faire, mais c'est la seule que j'ai trouvé après avoir cherché comme une débile pendant 50 minutes ._. | | |
|
| |
Kaylee
{ Membre }
Messages : 24
| Bonsoir,
J'ai essayé ton code qui est superbe vu que je l'aie essayé sur mon autre forum qui est en pause bref sur l'actuelle il ne fonctionne pas certainement parce que j'ai mis le profil en infobulle donc si tu pouvais m'aider.
Merci.
| | |
|
| |
Sighild
{ Membre }
Messages : 26
| Bonjour, Code super intéressant pour encadrer juste l'avatar. Mais j'aurais une question : est-ce que l'on peut mettre un effet "shadow" sur l'encadrement? à partir donc du code pour la feuille css?? Celui-ci dans mon cas : - Code:
-
.postdetails.poster-profile a img { border: 3px solid #223645; /*La bordure*/ } | | |
|
| |
emillie
{ Membre }
Messages : 60
| Merci beaucoup pour le tutaux | | |
|
| |
Invité Invité
| - Ikø' a écrit:
- Après presque qu'une heure de recherches sur le Forum de Forumactif utiliser la fonction rechercher là-bas est horrible, y'a trop de messages je n'ai qu'une solution.
MAIS~ Le contour va être là même si un membre n'a pas d'avatar . Donc, direction le template viewtopic_body Il faut aller chercher ce truc dans le template: - Code:
-
{postrow.displayed.POSTER_AVATAR} Ça c'est la balise Javascript de l'avatar dans les templates. Donc, on va entourer ce truc là d'une div avec une class qu'on va appeler contourava, tiens. Comme ça: - Code:
-
<div class="contourava">{postrow.displayed.POSTER_AVATAR}</div> Après ça on fait enregistrer, un clique sur le + vert pour publier le template, etc etc xD
Et là, go dans le CSS. Tu vas prendre ton code CSS, celui-là (tu as peut-être changé la couleur mais bon xD) - Code:
-
.postdetails.poster-profile a img { border: 6px solid #000000; /*La bordure*/ } et tu vas remplacer .postdetails.poster-profile a img par .contourava, ce qui devrait donner ce truc: - Code:
-
.contourava { border: 6px solid #000000; /*La bordure*/ } Ensuite, tu fais enregistrer. Perso j'ai essayé avec des avatars 100*100 et le cadre est déformé un peu sur la largeur mais ça s'arrange en ajoutant width: 100px; dans le CSS (width pour largeur, 100px pour la largeur de l'avatar) Donc c'est une façon un peu plus "radicale" de faire, mais c'est la seule que j'ai trouvé après avoir cherché comme une débile pendant 50 minutes ._. Merci beaucoup pour cette astuce, car à vrai dire je commençai à désespérer de ne pas y arriver. Merci ♠ | | |
|
| |
kiflesjaps
{ Membre }
Messages : 34
| J'arrive pas a arrondir ! voici mon code - Code:
-
.profil_contour { border: 8px; solid; #737373; /*La bordure*/ background-color: #737373; /*Le fond*/ } { -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px; }
| | |
|
| |
Kaktus
{ Membre }
Messages : 68
| Quelques problèmes dans ton code CSS, essais ceci: - Code:
-
.profil_contour{ border: 8px; solid; #737373; background-color: #737373; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } Tu avais mis { et } du milieu en trop. Et aussi, tu veux faire le même arrondi pour les 4 coins, alors je t'ai réunis tes 4 valeurs, et je t'ai rajouté de choses pour que ce soit compatibles avec plusieurs navigateurs | | |
|
| |
kiflesjaps
{ Membre }
Messages : 34
| Super ça marche Merci Kaktus ! | | |
|
| |
Kaktus
{ Membre }
Messages : 68
| Ravie d'avoir pu t'aider | | |
|
| |
Contenu sponsorisé
| |
| |
| Mettre un contour au profil et/ou à l'avatar (messages) | |
|