Problème de code sur les boutons dans le CSS
3 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Problème de code sur les boutons dans le CSS
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.
Dernière édition par emc2 le Ven 26 Juil 2024 - 7:36, édité 1 fois
Re: Problème de code sur les boutons dans le CSS
Bonjour,
Une idée bête, mettre tous les liens http en https ?
Comme c'est un codage ancien...
Une idée bête, mettre tous les liens http en https ?
Comme c'est un codage ancien...
Re: Problème de code sur les boutons dans le CSS
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 :
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 :
PS : vous pouvez aussi changer les liens en https comme le dit Scoubifitz, ça ne coûte rien et c'est plus "moderne compatible" !
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" !
Re: Problème de code sur les boutons dans le CSS
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 !!!!!
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 !!!!!
Sujets similaires
» Un code CSS pour les boutons "accueil", "messagerie", etc...
» Code pour changer les boutons des différents thème de mon forum
» Problème de code javascript inhérent au code du forum
» Problème avec le code [Sélectionner un code]
» Code pour déplacer les boutons "prévisualiser " et " envoyer " sur la page édition d'un commentaire
» Code pour changer les boutons des différents thème de mon forum
» Problème de code javascript inhérent au code du forum
» Problème avec le code [Sélectionner un code]
» Code pour déplacer les boutons "prévisualiser " et " envoyer " sur la page édition d'un commentaire
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum