Problème de code sur les boutons dans le CSS

[emc2]

Détails techniques

Version du forum : phpBB3
Poste occupé : Fondateur
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 : Dès la pose du code CSS
Lien du forum : https://cinepartage.forumactif.com/

Description du problème

Bonjour,
Lorsque j'applique mon codage dans le CSS, un seul bouton (calendrier) apparait. Les autres sont invisibles mais utilisables puisque si je promène mon curseur, je vois apparaitre l'info bulle du bouton survolé. Il est vrai que j'avais codé à l'époque pour un phpBB2, mais enfin, je ne vois pas pourquoi cela marche pour un bouton et aucun autre.
Voici mon CSS:

Code:

/*ACCUEIL*/
#i_icon_mini_index{background-image:url(http://i97.servimg.com/u/f97/19/53/12/91/accuei10.png); width:66px; height:42px;}
#i_icon_mini_index:hover{background-image:url(http://i97.servimg.com/u/f97/19/53/12/91/accuei11.png); width:66px; height:42px;}
/*CALENDRIER*/
#i_icon_mini_calendar{background-image:url(http://i97.servimg.com/u/f97/19/53/12/91/calend11.png); width:82px; height:42px;}
#i_icon_mini_calendar:hover{background-image:url(http://i97.servimg.com/u/f97/19/53/12/91/calend10.png); width:82px; height:42px;}
/*FAQ*/
#i_icon_mini_faq{background-image:url('http://i75.servimg.com/u/f75/16/74/01/20/33_24_10.png'); /*w=33 h=24*/width:0px; height:0px;}
#i_icon_mini_faq:hover{background-image:url('http://i75.servimg.com/u/f75/16/74/01/20/33_24_11.png'); width:33px; height:24px;}
/*RECHERCHE*/
#i_icon_mini_search{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/recher10.png'); width:85px; height:42px;}
#i_icon_mini_search:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/recher11.png'); width:85px; height:42px;}
/*MEMBRES*/
#i_icon_mini_members{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/membre10.png'); width:76px; height:42px;}
#i_icon_mini_members:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/membre11.png'); width:76px; height:42px;}
/*GROUPES*/
#i_icon_mini_groups{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/groupe10.png'); width:69px; height:42px;}
#i_icon_mini_groups:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/groupe11.png'); width:69px; height:42px;}
/*PROFIL*/
#i_icon_mini_profile{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/profil10.png'); width:58px; height:42px;}
#i_icon_mini_profile:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/profil11.png'); width:58px; height:42px;}
/*MP (pas de nx messages)*/
#i_icon_mini_message{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/messag10.png'); width:70px; height:42px;}
#i_icon_mini_message:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/messag11.png'); width:70px; height:42px;}
/*MP (nx messages)*/
#i_icon_mini_new_message{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/nv_mes10.png'); width:70px; height:42px;}
#i_icon_mini_new_message:hover{background-image:url('http://i97.servimg.com/u/f97/19/53/12/91/nv_mes11.png'); width:70px; height:42px;}
/*DECONEXION*/
#i_icon_mini_logout{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/deconn11.png'); width:93px; height:42px;}
#i_icon_mini_logout:hover{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/deconn10.png'); width:93px; height:42px; }
/*S'ENREGISTRER*/
#i_icon_mini_register{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/sinscr11.png'); width:78px; height:42px;}
#i_icon_mini_register:hover{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/sinscr10.png'); width:78px; height:42px;}
/*CONNEXION*/
#i_icon_mini_login{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/connex11.png'); width:84px; height:42px;}
#i_icon_mini_login:hover{background-image:url('http://i97.servimg.com/u/f97/19/49/33/80/connex10.png'); width:84px; height:42px;}
.i_post{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/nouvea10.png'); width:68px; height:35px;}
.i_post:hover{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/nouvea11.png');}
img[alt="Répondre au sujet"],img[alt="Répondre au message"]{background: url('http://i35.servimg.com/u/f35/18/78/04/18/repond10.png') top; width:68px; height:35px;}
img[alt="Répondre au sujet"]:hover,img[alt="Répondre au message"]:hover{background-position: bottom; /* position du sprite */}
img[alt="Envoyer l'e-mail"]{background: url('https://i62.servimg.com/u/f62/19/80/66/73/bouton11.png') top; width:42px; height:34px;}
img[alt="Envoyer l'e-mail"]:hover{background-position: bottom; /* position du sprite */}
.i_icon_quote{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/citer_10.png'); width:42px; height:30px;}
.i_icon_quote:hover{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/citer_11.png');}
.i_icon_edit{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/editer10.png'); width:48px; height:30px;}
.i_icon_edit:hover{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/editer11.png');}
.i_icon_delete{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/x_of10.png'); width:28px; height:30px;}
.i_icon_delete:hover{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/x_on10.png');}
.i_icon_ip{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/ip_of10.png'); width:28px; height:30px; }
.i_icon_ip:hover{background-image: url('http://i35.servimg.com/u/f35/18/78/04/18/ip_on10.png');}
.i_icon_pm{background-image: url('https://i62.servimg.com/u/f62/19/80/66/73/bouton12.png'); width:42px; height:34px;}
.i_icon_pm:hover{background-image: url('https://i62.servimg.com/u/f62/19/80/66/73/bouton13.png');}
.i_icon_profile{background-image: url('https://i62.servimg.com/u/f62/19/80/66/73/bouton14.png'); width:42px; height:34px;}
.i_icon_profile:hover{background-image: url('https://i62.servimg.com/u/f62/19/80/66/73/bouton15.png');}
/*Icone lien reponse*/
dd.lastpost img[alt="Voir le dernier message"]{background-image: url('http://i35.servimg.com/u/f35/18/52/82/28/bouton12.png'); width:18px; height:18px; }
dd.lastpost img[alt="Voir le dernier message"]:hover{background-image: url('http://i35.servimg.com/u/f35/19/49/80/19/bouton10.png');}
/*Icone lien nouvelle reponse*/
dd.lastpost img[alt="Voir le message le plus récent"]
{
}
/*Icone lien nouvelle reponse au survol*/
dd.lastpost img[alt="Voir le message le plus récent"]:hover
{
}

img#i_icon_quote[alt="Editer le message"]{background-image:url(http://i35.servimg.com/u/f35/18/78/04/18/editer10.png);height:30px;width:48px;}
img#i_icon_quote[alt="Editer le message"]:hover{background-image:url(http://i35.servimg.com/u/f35/18/78/04/18/editer11.png);}

Les graphitis en rouge sur le screen, montre là ou je devrait retrouver mes bouton sur la barre de nav' par exemple. Et l'on voit que seul le bouton "calendrier" est présent.
Je vais continuer de mon côté à rechercher le problème, mais si quelqu'un a une fulgurence, je veux bien un coup de main
Merci par avance.

[emc2]

bonjour,
Du nouveau dans mon apparence,
les bouton de fonctionnalité de messages pour les utilisateurs sont apparus ! Ils n'y étaient pas hier.

[Scoubifitz]

Bonjour,

Une idée bête, mettre tous les liens http en https ?

Comme c'est un codage ancien...

[Toryudo]

Bonjour !

Je viens de regarder aussi : le code fonctionne, mais il y a du code CSS additionnel qui "décale" les backgrounds.
Si je prends l'exemple du code CSS par défaut du bouton home :

Code:

.sprite-icon_home {
  background: url(https://2img.net/i/fa/sprite_prosilver_navbar.png) no-repeat top left;
  background-position: 0 -255px;
  width: 13px;
  height: 12px;
}

Votre valeur de background-image écrase l'image par défaut, c'est bon.
Par contre, il reste un background position, un no-repeat, un top et un left qui bouge l'image de votre background, c'est-à-dire qu'elle finit "hors cadre".
La seule image n'est pas déplacée hors cadre, c'est le calendrier, parce qu'il a un background-position: 0 0; par défaut.

En conséquence, vous avez juste à ajouter ceci à vos différents boutons :

Code:

background-position: 0 0;

PS : vous pouvez aussi changer les liens en https comme le dit Scoubifitz, ça ne coûte rien et c'est plus "moderne compatible" !

[emc2]

Oui, je regarde ça tout de suite et je reviens pour le rapport.
Merci et c'est vrai que je n'avais même pas percuté pour le https.

... ... ... Quelques minutes plus tard donc !

Effectivement, cela va mieux, et m'a permit de trouver d'autres petites erreurs comme le guillemet simple sur certaines url d'images qui étaient absentes et quelques autres joyeusetés qui n'ont pas de rapport avec ce problème. Bon, ce n'est pas parfait, mais je vais pouvoir corriger les coquilles de mon vieux CSS qui commence à dater, en effet ! Je vais me faire une petite MaJ dans le cerveau.
Merci beaucoup en tout cas et Problème Résolu !!!!!