Problème d'affichage du pseudo

[ClementDEV]

Bonjour à tous, je poste concernant un problème avec mon code forum (pseudo).

J'ai réalisé un code forum afin de modifier mon pseudo forum mais rien ne se passe..

Ce code je l'ai inséré dans le CSS.

Code:

/* Couleur pseudo */
a[href="/u1"] strong{
  background-image: linear-gradient(to right, #881717 0%, #f37115 31%, #881717 51%, #c85315 80%, #881717 100%);
  padding: 0px 7px 0px 7px;
  text-align: center;
  text-transform: uppercase;
  transition: 0.5s;
  background-size: 200% auto;
  color: white;
 text-shadow: 0px 0px 10px rgba(0,0,0,0.2);
  box-shadow: 0 0 20px #eee;
  border-radius: 5px;
 -webkit-animation: anim 10s ease 0s infinite normal ;
 animation: anim 10s ease 0s infinite normal ;
}

Lorsque je me rends sur un sujet que j'ai posté, mon pseudo est resté normal sans aucune animation et couleur.

Que dois-je modifier ou ajouter de plus ?..



Merci en avance pour vos réponses, en espérant trouver une solution à mon problème !

[*Splash*]

Hi,

L'effet cherché est de quel ordre ?

[ClementDEV]

Hi,

L'effet cherché est de quel ordre ?

Salut,

C'est-à-dire ?

[*Splash*]

C'est à dire ça :

J'ai réalisé un code forum afin de modifier mon pseudo forum mais rien ne se passe..

De plus cette valeur en CSS n'est pas prise en compte je pense :

Code:

a[href="/u1"]

[ClementDEV]

C'est à dire ça :

J'ai réalisé un code forum afin de modifier mon pseudo forum mais rien ne se passe..

De plus cette valeur en CSS n'est pas prise en compte je pense :

Code:

a[href="/u1"]

Bien je ne comprends pas alors, puis ce-que j'ai un autre site ou les grades s'affichent correctement alors qu'ils sont aussi renseignés dans le code CSS ?

Comment puis-je faire pour que l'effet/style que j'ai renseigné dans le CSS soit assigné à mon compte ADMIN [ID n°1].

Le rendu devait-être le suivant:

Merci..

[*Splash*]

Au temps pour moi !

Je viens de tester ton code CSS sur un forum test, il fonctionne parfaitement

[ClementDEV]

C’est bizarre moi rien n’est affiché

[Fallen Leaves]

Bonjour ClementDEV

Je pense que le code ne fonctionne pas tout simplement parce que ton compte "Admin" n'est dans aucun groupe, du coup il s'affiche en écriture simple et non en gras. Comme dans ton code CSS tu as précisé "strong", le code ne peut fonctionner que si l'utilisateur n°1 est dans un groupe.
Soit tu mets Admin dans un groupe, soit tu modifies "a[href="/u1"] strong" en "a[href="/u2"] strong" (dans ce cas l'effet sera mis sur le membre n°2 "Angelo_Maillet")

En espérant t'avoir aidé

[*Splash*]

Si ton code doit être utilisé sur le forum renseigné dans ton profil, essaie de remplacer strong par topic-author

[ClementDEV]

J’ai re-créé un compte donc l’ID 4 j’ai modifié le code dans le css par 4 j’ai créé un groupe Développeur web et je l’ai mis dedans et toujours rien..

[Fallen Leaves]

Re,

Ton 4ème utilisateur "Danilo Cuntigh" ne semble pas avoir été mis dans un groupe sinon son écriture serait en gras et en couleur (couleur du groupe) Es-tu sûr de bien l'avoir mis dans un groupe ?

Edit : ton groupe "Développement" (si c'est bien dans celui là que tu l'as mis) n'a aucun membre (à part le modérateur de groupe) http://cnvroleplay.forumactif.com/g5-developpement

[ClementDEV]

Re, il est membre de deux groupes différents et celui admin aussi.. Mais rien ne se passe, c’est vraimenr bizarre..

[*Splash*]

Il est membre du groupe Admin HR, /u2

[Fallen Leaves]

Ah ça y est il apparaît dans le groupe "Développement" !
Mais tu as un souci avec le CSS, remplace ton code par celui-ci :

Code:

a[href="/u4"] strong {
    -webkit-animation: anim 10s ease 0s infinite normal ;
 animation: anim 10s ease 0s infinite normal ;
    background-image: linear-gradient(to right, #881717 0%, #f37115 31%, #881717 51%, #c85315 80%, #881717 100%);
    background-size: 200% auto;
    border-radius: 5px;
    box-shadow: 0 0 20px #eee;
    color: #fff;
    padding: 0 7px;
    text-align: center;
    text-shadow: 0 0 10px rgba(0,0,0,0.2);
    text-transform: uppercase;
    transition: .5s;
}

[*Splash*]

Blanc sur blanc par contre c'est pas l'idéal

[ClementDEV]

J’ai essayé avec une autre couleur lorsque je vais dans inspecter l’élément ça me met le code mais « Invalid property value »

[*Splash*]

Si tu veux modifier la couleur de l'affichage du pseudo tu modifie cette valeur :

Code:

color: #fff;

#fff c'est blanc

[ClementDEV]

Non non, le but est d’avoir un grade linéaire donc dégradé va voir sur mon site http://7p-team.tk/ et appuie sur liste des membres tu va comprendre

[*Splash*]

OK je vois

Sur ton site la modification est appliquée à un groupe et nom à un membre, ensuite l'effet est appliqué à une class préfixe style16 :

Code:

.prefix.style16 {
    background-image: linear-gradient(to right, #FF1A1A 0%, #FF8080 31%, #ffffff 41%, #B30000 80%, #000000 100%);
    padding: 0px 7px 0px 7px;
    text-align: center;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    text-shadow: 0px 0px 10px rgba(0,0,0,0.2);
    box-shadow: 0 0 20px #eee;
    border-radius: 5px;
    -webkit-animation: animaina 10s ease 0s infinite normal;
    animation: animaina 10s ease 0s infinite normal;
}

[ClementDEV]

Justement là en l’occurrence j’aimerais l’appliquer uniquement à mon compte et pas au groupe..

[*Splash*]

Cette partie du code n'a aucun effet :

Code:

 -webkit-animation: anim 10s ease 0s infinite normal ;
 animation: anim 10s ease 0s infinite normal ;

[ClementDEV]

Cette partie du code n'a aucun effet :

Code:

 -webkit-animation: anim 10s ease 0s infinite normal ;
 animation: anim 10s ease 0s infinite normal ;

Oui, et je ne comprends pas pourquoi ?..

[Fallen Leaves]

Je viens de comprendre que fofoactif n'aimait pas les espaces dans linear-gradient, de ce fait le code CSS ne ressemble plus à rien une fois la feuille validée, dans l'inspecteur d'éléments on obtient ça :

Code:

background: linear-gradient(toright,#881717,#f3711531%,#88171751%,#c8531581%,#881717);

Tout est collé, d'où le fait que ta propriété apparaisse en erreur et que le fond soit transparent.

Pour remédier à ça (heureusement il y a toujours une solution ) on va utiliser les codes rgba, ça ressemblera donc à ceci :

Code:

background: linear-gradient(90deg,rgba(136,23,23,1),rgba(243,113,21,1)31%, rgba(136,23,23,1)51%, rgba(200,83,31,1)80%,rgba(136,23,23,1));

Mets ça dans ton code CSS et ça devrait fonctionner, tu auras ton dégradé derrière le pseudo

Code:

a[href="/u4"] strong {
    background: linear-gradient(90deg,rgba(136,23,23,1),rgba(243,113,21,1)31%, rgba(136,23,23,1)51%, rgba(200,83,31,1)80%,rgba(136,23,23,1));
    background-size: 200% auto;
    border-radius: 5px;
    box-shadow: 0 0 20px #eee;
    color: #fff;
    padding: 0 7px;
    text-align: center;
    text-shadow: 0 0 10px rgba(0,0,0,0.2);
    text-transform: uppercase;
}

Par contre j'ai essayé de recréer l'animation mais je n'y suis pas arrivée..

[ClementDEV]

Oh punaise ça fonctionne, merci en effet c'est bizarre !

L'effet je n'arrive pas à le faire fonctionner non plus, je sais pas comment faire..

En effet il faudrait que j'ajoute

Code:

@-webkit-keyframes animaina {
  25%{
    background-position: right center;
  }
  50%{
    background-position: left center;
  }
  75%{
    background-position: right center;
  }
  100%{
    background-position: left center;
  }
}

Mais c'est bizarre..

[ClementDEV]

Le problème est résolu, franchement je suis bête car c'était tout simple.

J'ai décoché la case "Optimiser votre CSS" et désormais tout fonctionne..

J'ai envie de me metttre des claques mdrr.

Merci pour votre aide en tout cas, vous m'avez aidé et ça fait plaisir de voir une communauté d'entraide !