Soucis d'apparence avec la liste de notifications de la Toolbar

[ombrageux]

Rappel du premier message :

Détails techniques

Version du forum : Invision
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Modification du thème
Lien du forum : https://defoulloir.forumactif.com/

Description du problème

Bonjour,

J'ai fait une modification sur la Toolbar à partir d'un script trouvé sur le forum d'entraide, mais depuis, la liste de notification de la toolbar a été modifié et un interligne s'est mis entre deux notifications, rallongeant considérablement cette liste au point de ne pas voir la fin.

Quelqu'un peut regarder d'où vient le problème ?

D'avance, merci.

[ombrageux]

https://defoulloir.forumactif.com/

Là, ça semble fonctionner, j'ai dû faire une erreur en recopiant tout à l'heure et je viens de tout refaire proprement.

Ça ne fonctionne pas sur le forum test, mais ce n'est pas important.

Un grand merci à vous pour tout le travail effectué.

Je laisse le sujet ouvert jusqu'à demain, le temps de voir si il n'y a pas de soucis du côté des membres.

[Stefano123]

Pouvez-vous me donner le lien de votre forum test s'il vous plait !

Car entre les 2 forums, je ne sais plus qui est qui, pour voir ça, merci

[ombrageux]

https://defoulloir.forumactif.com/

C'est le forum de discussion

https://routiersympa.forumactif.com/

C'est le forum test, un forum que j'avais créé il y a longtemps mais que je n'ai pas eu le temps de m'occuper.

[Stefano123]

Ressayer sur votre forum test :
Car j'ai l'impression que sur votre forum test, vous avez oublié d'ajouter le code pour fixer la barre toolbar :

La barre toolbar fixe :

Code:

div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
position: fixed !important;
    margin-inline: 14px;
}

la barre des boutons fixe :

Code:

#submenu {
    background: #fff;
    color: #0076b1;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    z-index: 999;
}

On va y arriver, enfin espérons,

[ombrageux]

A priori non, puisque j'ai fait un copier/coller du défouloir vers le test de toute la feuille CSS.

Je vous ça ce soir plus en détail et je vous tiens au courant.

[MlleAlys]

Bonjour,
Vous semblez avoir collé plusieurs fois le même code sur les deux forums, mais il y a une ou plusieurs erreurs au moins dans l'imbrication des codes qui font que sur votre forum test celui pour fixer la toolbar est mal lu et n'est pas pris en compte.

Pourriez-vous fournir l'ensemble de vos feuilles de style css pour qu'on puisse les corriger ?

[Stefano123]

Bonjours à vous,

@MlleAlys, merci à vous de votre soutien, en espérant que ombrageux, va pouvoir résoudre ceci dans un bon fonctionnement.  

Cordialement,

[ombrageux]

Bonjour et merci MlleAlys du renfort.

Le CSS du Défouloir :

Code:

#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}
#submenu ul img{
width: 130px;
margin-right:-12px;
}
.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}
 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]
{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]
{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
tr.newpost td {
    background-color: #EBEADD!important;
}
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
div#fa_toolbar div, div#fa_toolbar span {
    margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
#fa_toolbar #fa_right #notif_list li:first-child {
    padding-top: 1.5em; }
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
}position: fixed !important;
    margin-inline: 14px;
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
position: fixed !important;
    margin-inline: 14px;
}
#submenu {
    background: #fff;
    color: #0076b1;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    z-index: 999;
}


Celui du forum test :

Code:

#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}
#submenu ul img{
width: 130px;
margin-right:-12px;
}
.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}
 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]
{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]
{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
tr.newpost td {
    background-color: #EBEADD!important;
}
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
div#fa_toolbar div, div#fa_toolbar span {
    margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
#fa_toolbar #fa_right #notif_list li:first-child {
    padding-top: 1.5em; }
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
}position: fixed !important;
    margin-inline: 14px;
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
position: fixed !important;
    margin-inline: 14px;
}
#submenu {
    background: #fff;
    color: #0076b1;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    z-index: 999;
}


Bon courage et merci d'avance.

A savoir que je peux ouvrir l'administration du forum test, si c'est plus pratique pour vous.

[MlleAlys]

A partir de la ligne 144, vous avez ceci :

Code:

div#fa_toolbar div, div#fa_toolbar span {
    margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
#fa_toolbar #fa_right #notif_list li:first-child {
    padding-top: 1.5em; }
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
}position: fixed !important;
    margin-inline: 14px;
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
position: fixed !important;
    margin-inline: 14px;
}
#submenu {
    background: #fff;
    color: #0076b1;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    z-index: 999;
}

Outre le fait qu'une partie est en doublon, vous devez faire attention à bien mettre les codes css les uns après les autres, sans les imbriquer les uns dans les autres : vérifiez notamment les accolades. Chaque code css est sous la forme :

Code:

élément concerné {
  la mise en forme de l élément entre les accolades ;
}

Vous pouvez passer une ou deux lignes entre les différents codes pour être sûr de ne pas les mélanger.
En l'occurrence ici lignes 156 et 157 vous avez des propriétés de mise en forme qui ne sont pas entre accolades, ne sont donc rattachés à aucun élément, et faussent la lecture du code suivant.

Remplacez donc le passage indiqué au début par ces codes-ci :

Code:




/********* TOOLBAR ET NAVIGATION ***********/
 

div#fa_toolbar div, div#fa_toolbar span {
  margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}


#fa_toolbar #fa_right #notif_list li:first-child {
  padding-top: 1.5em;
}


#fa_right {
  padding-right: 5px;
}


/*navigation flottante*/

#submenu {
  position: fixed;
  top: 30px;
  left: 0;
  right: 0;
  padding: 5px;
  z-index: 999;
}


#logostrip {
  margin-top: 35px;
}


/********* FIN TOOLBAR ET NAVIGATION ***********/





Enregistrez.




Puis sur votre forum "routiers-sympa", dans Modules > Toolbar > configuration > cochez l'option "Fixer la toolbar" sur OUI, puis enregistrez.
Le code n'étant pas fonctionnel jusqu'ici, c'est cette option là qui faisait la différence entre vos deux forums.


Si vous souhaitez appliquer à nouveau un arrondi sur les coins de la toolbar (ou une autre mise en forme de votre choix), c'est évidemment possible.

[Stefano123]

Effectivement, ombrageux, vous avez des doublons en codes,

Cordialement,

[Stefano123]

Dans le forum test :

J'ai enlevé tous les codes en doublons
Puis Remplacé la ligne à partir de 144 comme indiqué par : @MlleAlys

Code:

#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}

#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}

#submenu ul img{
width: 130px;
margin-right:-12px;
}

.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}

 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}

/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}

table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}

tr.newpost td {
    background-color: #EBEADD!important;
}

.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}

a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}

a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}

div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
 
 
 
/********* TOOLBAR ET NAVIGATION ***********/
 
 
div#fa_toolbar div, div#fa_toolbar span {
  margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
 
 
#fa_toolbar #fa_right #notif_list li:first-child {
  padding-top: 1.5em;
}
 
 
#fa_right {
  padding-right: 5px;
}
 
 
/*navigation flottante*/
 
#submenu {
  position: fixed;
  top: 30px;
  left: 0;
  right: 0;
  padding: 5px;
  z-index: 999;
}
 
 
#logostrip {
  margin-top: 35px;
}
 
 
/********* FIN TOOLBAR ET NAVIGATION ***********/


Si c'est bien ça !!

[ombrageux]

Merci à vous deux,

Visiblement Stéfano123, il y a un soucis dans la correction au vu de la capture que j'ai fait et la barre de bouton n'est pas flottante.

Voilà ce que ça donne au complet.

Code:

#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
#quick_reply input {
   background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}
#submenu ul img{
width: 130px;
margin-right:-12px;
}
.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}
 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]
{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]
{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
tr.newpost td {
    background-color: #EBEADD!important;
}
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
 
#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}
 
#submenu ul img{
width: 130px;
margin-right:-12px;
}
 
.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}
 
 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
 
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
 
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
 
tr.newpost td {
    background-color: #EBEADD!important;
}
 
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
 
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
 
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
 
div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
 
 
 
/********* TOOLBAR ET NAVIGATION ***********/
 
 
div#fa_toolbar div, div#fa_toolbar span {
  margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
 
 
#fa_toolbar #fa_right #notif_list li:first-child {
  padding-top: 1.5em;
}
 
 
#fa_right {
  padding-right: 5px;
}
 
 
/*navigation flottante*/
 
#submenu {
  position: fixed;
  top: 30px;
  left: 0;
  right: 0;
  padding: 5px;
  z-index: 999;
}
 
 
#logostrip {
  margin-top: 35px;
}
 
 
/********* FIN TOOLBAR ET NAVIGATION ***********/

[MlleAlys]

Ah, j'avais oublié un triplon dans mon message précédent.

@Stefano123 > Je ne vois pas bien ce que vous avez modifié à part l'indication que j'ai donnée ?

@ombrageux > Avez-vous également bien modifié l'option indiquée dans mon message précédent ?
Votre css à remplacer au complet, réaligné pour l'occasion, et avec quelques commentaires en plus sur les derniers codes :

Code:

#i_icon_mini_profile {
  margin-left: -10px;
}


/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
  color: #FFFFFF; /* Couleur des pseudos de la liste */
  font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
  text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
  color: #FFFFFF; /* Couleur des pseudos de la liste */
  font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
  text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}


/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
  background: #0598E4; /* Couleur de fond */
  border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
  border-radius: 4px; /* Bordure arrondis du bouton */
  box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
  font-family: Trebuchet MS; /* Police d'écriture du bouton */
  font-size: 11.4px; /* Taille de la police d'écriture du bouton */
  font-weight: 700; /* Taille de la police grasse du bouton */
  height: 21px; /* Hauteur des boutons */
  text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}

#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
  font-weight: bold; /*-- texte en gras --*/
  color: #FFFFFF; /*-- texte en rouge --*/
}

#submenu ul img {
  width: 130px;
  margin-right:-12px;
}

.postdetails .label span, .postdetails .label{
  color: #12A3EB !important;
}

/* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"] {
  padding:5px;
  background:#20aec8!important;
  color:#fff!important;
  border:none!important;
  border-radius:5px;
}

/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"] {
  padding:5px;
  background:#0076b1!important;
  color:#fff!important;
  border:none!important;
  border-radius:5px;
}

table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}

tr.newpost td {
  background-color: #EBEADD!important;
}

.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}

a#fa_rss {
  background:url('adresse_de_votre_image')no-repeat!important;
}

a#fa_mail {
  background:url('adresse_de_votre_image')no-repeat!important;
}
 
 
 
 
/********* TOOLBAR ET NAVIGATION ***********/


/*apparence de la toolbar*/
#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}

div#fa_toolbar div, div#fa_toolbar span {
  margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
 
 
#fa_toolbar #fa_right #notif_list li:first-child {
  padding-top: 1.5em;  /*marge interne notif*/
}
 
 
#fa_right {
  padding-right: 5px;  /*marge des liens avec le bord droit de l écran*/
}
 
 
/*navigation flottante*/
 
#submenu {
  position: fixed;  /*menu fixe à l écran*/
  top: 30px;  /*sous la toolbar*/
  padding: 5px;  /*marge intérieure*/
  left: 0;
  right: 0;
  z-index: 999;
}
 
 
#logostrip {
  margin-top: 35px;  /*décalage de la bannière sous la barre de navigation*/
}
 
 
/********* FIN TOOLBAR ET NAVIGATION ***********/
 
 
 

[ombrageux]

Oupps, j'avais oublié de fixer la toolbar, elles sont flottantes toutes les deux maintenant, mais elles se chevauchent légèrement dans le test alors qu'elles sont bien dans le Défouloir.

[Stefano123]

@Stefano123 > Je ne vois pas bien ce que vous avez modifié à part l'indication que j'ai donnée ?

j'ai juste enlevé les codes en doublons du CSS dans le forum test,
Puis Remplacé la ligne à partir de 144 comme vous avez indiqué :

C'est tout ce que j'ai fait, je n'ai touché à rien d'autre.
Je ne me serais pas permis de modifier autre chose, sans l'avoir précisé !

Édit :

ombrageux, tentez donc de suivre les indications données par @MlleAlys qui m'a l'air de s'y connaître !
En espérant que vous trouverez la solution idéale.

Bonne soirée,

cordialement,

[MlleAlys]

@Stefano 123 > Non justement je ne vois pas de quels doublons vous voulez parler...


@ombrageux > Avez-vous bien remplacé TOUT votre css par celui donné ? Je vois encore des codes en triple en inspectant votre forum, et pas celui donné...
Faites ainsi :

1. Supprimez l'intégralité du contenu de la feuille de style de votre forum, pour revenir à une feuille de style css complètement vide
   
   
2. enregistrez (le forum reprendra temporairement son apparence par défaut), actualisez la page pour être sûr que cela a bien été pris en compte et que la zone de saisie et bien vide.
   
   
3. cliquez sur l'icone en haut à droite du bloc code ci-dessous pour le sélectionner et copiez-le (en faisant clic droit > copier, ou bien ctrl+C) :
   

   Code:

   #i_icon_mini_profile {
  margin-left: -10px;
}
 
 
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
  color: #FFFFFF; /* Couleur des pseudos de la liste */
  font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
  text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
  color: #FFFFFF; /* Couleur des pseudos de la liste */
  font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
  text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
  background: #0598E4; /* Couleur de fond */
  border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
  border-radius: 4px; /* Bordure arrondis du bouton */
  box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
  font-family: Trebuchet MS; /* Police d'écriture du bouton */
  font-size: 11.4px; /* Taille de la police d'écriture du bouton */
  font-weight: 700; /* Taille de la police grasse du bouton */
  height: 21px; /* Hauteur des boutons */
  text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
 
#quick_reply input {
  background-color: #0598E4; /* Couleur de fond de la liste */
  font-weight: bold; /*-- texte en gras --*/
  color: #FFFFFF; /*-- texte en rouge --*/
}
 
#submenu ul img {
  width: 130px;
  margin-right:-12px;
}
 
.postdetails .label span, .postdetails .label{
  color: #12A3EB !important;
}
 
/* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"] {
  padding:5px;
  background:#20aec8!important;
  color:#fff!important;
  border:none!important;
  border-radius:5px;
}
 
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"] {
  padding:5px;
  background:#0076b1!important;
  color:#fff!important;
  border:none!important;
  border-radius:5px;
}
 
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
 
tr.newpost td {
  background-color: #EBEADD!important;
}
 
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
 
a#fa_rss {
  background:url('adresse_de_votre_image')no-repeat!important;
}
 
a#fa_mail {
  background:url('adresse_de_votre_image')no-repeat!important;
}
 
 
 
 
/********* TOOLBAR ET NAVIGATION ***********/
 
 
/*apparence de la toolbar*/
#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
div#fa_toolbar div, div#fa_toolbar span {
  margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
 
 
#fa_toolbar #fa_right #notif_list li:first-child {
  padding-top: 1.5em;  /*marge interne notif*/
}
 
 
#fa_right {
  padding-right: 5px;  /*marge des liens avec le bord droit de l écran*/
}
 
 
/*navigation flottante*/
 
#submenu {
  position: fixed;  /*menu fixe à l écran*/
  top: 30px;  /*sous la toolbar*/
  padding: 5px;  /*marge intérieure*/
  left: 0;
  right: 0;
  z-index: 999;
}
 
 
#logostrip {
  margin-top: 35px;  /*décalage de la bannière sous la barre de navigation*/
}
 
 
/********* FIN TOOLBAR ET NAVIGATION ***********/
 
 
 

   
   
4. collez ce code dans la feuille de style de votre forum (qui avait donc été totalement vidée au point 1)
   
5. enregistrez
   

[Stefano123]

@Stefano 123 > Non justement je ne vois pas de quels doublons vous voulez parler...

Vous pouvez y voir les doublons !

Bonjour et merci MlleAlys du renfort.

Celui du forum test :

Code:

#i_icon_mini_profile {
margin-left: -10px;
}
/******** Personnalisation des listes de pseudos ********/
 
/* Liste des pseudos qui aiment un message */
 
.fa_like_list {
  background-color: #12A3EB; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_like_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/* Liste des pseudos qui n'aiment pas un message */
 
.fa_dislike_list {
  background-color: #0076B1; /* Couleur de fond de la liste */
  color: #FFFFFF; /* Couleur de la police d'écriture de la liste */
  font-family: Trebuchet MS; /* Police d'écriture de la liste */
  font-size: 11.4px; /* Taille de la police d'écriture de la liste */
}
 
.fa_dislike_list a {
    color: #FFFFFF; /* Couleur des pseudos de la liste */
    font-family: Trebuchet MS; /* Police d'écriture des pseudos de la liste */
    font-size: 11.4px; /* Taille de la police d'écriture des pseudos de la liste */
    text-decoration:none; /*Retire le soulignement des pseudos de la liste */
}
 
/******** Personnalisation des textes des boutons ********/
 
/* Couleur du texte du bouton J'aime */
 
.fa_like {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton J'aime (active) */
 
.fa_liked {
  color:  #0bfc01;
}
 
/* Couleur du texte du bouton Je n'aime pas */
 
.fa_dislike {
  color: #FFFFFF;
}
 
/* Couleur du texte du bouton Je n'aime pas (active) */
 
.fa_disliked {
  color: #AA0000;
}
 
/******** Personnalisation avancée des boutons ********/
 
.rep-button, .rep-button:active, .rep-button:focus {
 
    background: #0598E4; /* Couleur de fond */
    border: 1px solid #005c8b; /* Couleur de la bordure du bouton */
    border-radius: 4px; /* Bordure arrondis du bouton */
    box-shadow: 0 -1px 0 #b9b9b9 inset; /* Ombre de la bordure du bouton */
    font-family: Trebuchet MS; /* Police d'écriture du bouton */
    font-size: 11.4px; /* Taille de la police d'écriture du bouton */
    font-weight: 700; /* Taille de la police grasse du bouton */
    height: 21px; /* Hauteur des boutons */
    text-transform: initial; /* Pour mettre une majuscule aux noms des boutons */
}
#quick_reply input {
   background-color: #0598E4; /* Couleur de fond de la liste */
    font-weight: bold; /*-- texte en gras --*/
    color: #FFFFFF; /*-- texte en rouge --*/
}
#submenu ul img{
width: 130px;
margin-right:-12px;
}
.postdetails .label span, .postdetails .label{
    color: #12A3EB !important;
}
 /* bouton envoyer previsualisation et brouillon*/
input[type="submit"][value="Envoyer"],input[type="submit"][name="preview"],input[type="submit"][name="draft"]
{
padding:5px;
background:#20aec8!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
/* bouton envoyer previsualisation brouillon etc*/
input[type="submit"], input[type="reset"] , input[type="button"]
{
padding:5px;
background:#0076b1!important;
color:#fff!important;
border:none!important;
border-radius:5px;
}
table.ipbtable td .par img {
  text-align: left;
  margin-right: 15px !important;
}
tr.newpost td {
    background-color: #EBEADD!important;
}
.fa_avatar img {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
div#fa_toolbar {
    background-color: #0598E4;  /* Couleur de fond */
    border: 5px solid white;  /* Ajoute une bordure de 2px de couleur */
    border-radius: 50px;  /* Arrondis les bords de la toolbar */
    margin: auto;  /* Centre la toolbar */
    position: relative;  /* Permet de décaler la toolbar */
    top: 10px;  /* Décale la toolbar du haut */
    width: 98%;  /* Modifie la longueur de la toolbar */
}
 
a#fa_hide {
    display: none!important;  /* Supprime la flèche "Cacher la toolbar" : Conseillé de le laisser ! */
}
 
div#fa_toolbar div, div#fa_toolbar span {
    margin: 0 5px;  /* Repositionne correctement le contenu de la toolbar */
}
#fa_toolbar #fa_right #notif_list li:first-child {
    padding-top: 1.5em; }
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
}position: fixed !important;
    margin-inline: 14px;
div#fa_toolbar {
    background-color: #0598E4;
    border: 5px solid #fff;
    border-radius: 50px;
    margin: auto;
    top: 0px;
    width: 98%;
position: fixed !important;
    margin-inline: 14px;
}
#submenu {
    background: #fff;
    color: #0076b1;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    z-index: 999;
}


Bon courage et merci d'avance.

A savoir que je peux ouvrir l'administration du forum test, si c'est plus pratique pour vous.

J'ai enlevé, Les doublons de ce code-là ! Comme il 'n'y sont plus, il est normal que vous ne les voyez plus !!

Cordialement,

[ombrageux]

@ombrageux > Avez-vous bien remplacé TOUT votre css par celui donné ? Je vois encore des codes en triple en inspectant votre forum, et pas celui donné...
Faites ainsi :

[list=1][*]Supprimez l'intégralité du contenu de la feuille de style de votre forum, pour revenir à une feuille de style css complètement vide

[*]enregistrez (le forum reprendra temporairement son apparence par défaut), actualisez la page pour être sûr que cela a bien été pris en compte et que la zone de saisie et bien vide.

[*]cliquez sur l'icone en haut à droite du bloc code ci-dessous pour le sélectionner et copiez-le (en faisant clic droit > copier, ou bien ctrl+C)

Voilà, c'est bon et visiblement tout fonctionne.

Mon erreur était de ne pas avoir enregistrer la feuille CSS une fois qu'elle était vide, j'ai cru qu'en sélectionnant et en collant et enregistrant, ça changeait l'ensemble du code.

[ombrageux]

Le script fonctionne sur les deux forums, un grand merci à vous deux pour votre travail et votre patience.

[Stefano123]

C'est cool, je suis content pour vous ombrageux, c'était le but… ⁣

Bonne soirée,

Cdt,

[ombrageux]

Encore merci, bonne soirée.

Je laisse le sujet ouvert jusqu'à demain en cas de soucis imprévus, puis je le fermerai.

[MlleAlys]

Mon erreur était de ne pas avoir enregistrer la feuille CSS une fois qu'elle était vide, j'ai cru qu'en sélectionnant et en collant et enregistrant, ça changeait l'ensemble du code.

Si vous sélectionnez tout le code à remplacer avant de coller, normalement oui. Mais de toute évidence, là il y avait un souci, donc que ce soit une mauvaise manipulation ou un souci technique, rajouter l'étape de l'enregistrement de la feuille vide permet d'être sûr de bien tout remplacer.
Tant mieux si ça a fonctionné cette fois, ça me parait aussi correct de mon côté !

[ombrageux]

Ça l'air de fonctionner, merci, j'aurai appris pas mal de chose dans cet échange.

[ombrageux]

Visiblement, tout fonctionne correctement.

Un grand merci à vous deux.

Bonne soirée.