Soucis entre firefox et opera
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Soucis entre firefox et opera
Bonjour à tous,
Incompatibilité entre les navigateurs quand tu nous tiens
Alors, j'ai effectué une modification sur mon template memberlist_body pour obtenir un affichage de la liste des membres comme en PHPBB3 alors que je suis en phpbb2.
Mes modifs fonctionnent correctement sous firefox mais, apparemment opera me centre des éléments comme l'avatar ou les boutons du profil.
Des captures d'écran seront plus explicites
Sous firefox
Sous opera
Le bug doit très certainement provenir de mon css qui doit être bourré d'erreurs .
Le voici
Merci par avance à l'âme compatissante qui me donnera un coup de main pour régler ce soucis d'apparence;
Je fournis comme d'habitude un tube d'aspirine :lol!:
Incompatibilité entre les navigateurs quand tu nous tiens
Alors, j'ai effectué une modification sur mon template memberlist_body pour obtenir un affichage de la liste des membres comme en PHPBB3 alors que je suis en phpbb2.
Mes modifs fonctionnent correctement sous firefox mais, apparemment opera me centre des éléments comme l'avatar ou les boutons du profil.
Des captures d'écran seront plus explicites
Sous firefox
Sous opera
Le bug doit très certainement provenir de mon css qui doit être bourré d'erreurs .
Le voici
- Code:
/* ---- Modification de la liste des membres ---- */
/* Boutons contact */
.contactUsers {
background :#6d900e;
padding:2px;
border-top: 1px solid #475803;
margin-top: -45px;}
.contactUsers img {
width: auto;
height: auto;}
/* Tabel general */
.infoUsers {
background: rgba(152,153,106,0.2);
margin-left: 55px;
padding: 5px !important;
top: -50px;
position: relative;
font-family: Verdana,Arial,Helvetica,sans-serif; color : black;
}
.tableUsers {
box-shadow: 0px 0px 4px #ccc;
background: #c2d454;
border: 1px solid #475803;
display: inline-table !important;
width: 250px;
font-size:11px;
margin: 5px;
font-family: Verdana,Arial,Helvetica,sans-serif;
color :#475803;
border-radius: 4px;
-moz-border-radius: 4px;
padding: 5px;
-webkit-border-radius: 4px;}
/* image avatar */
.userAvatar img {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius : 3px;
border: 1px solid #ddd;
width: 50px;
height: 50px;}
.userAvatar img:hover { box-shadow: 0px 0px 4px #ccc;-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg); }
/* pseudo des membres */
.userNames {
border-bottom: 1px solid #ddd;
padding: 2px;
margin-bottom: 4px;}
/* ---- FIN modification liste des membres---- */
Merci par avance à l'âme compatissante qui me donnera un coup de main pour régler ce soucis d'apparence;
Je fournis comme d'habitude un tube d'aspirine :lol!:
Dernière édition par demeter1 le Mer 10 Oct 2012 - 17:52, édité 1 fois
Re: Soucis entre firefox et opera
Bonjour,
Alors, lorsque tu utilises des propriétés préfixées, il faut le faire dans un certain ordre ; à savoir en mettant la propriété finale en dernier. Il faut également penser à ne pas en oublier.
Donc lorsque tu fais :
En faisant ainsi, tu t'assures d'une part que chaque navigateur reçoive au moins une version préfixées (non stable) d'une propriété, et que si elle prend en charge la propriété finale (c'est le cas d'IE10), il utilise cette propriété en surclassant la propriété préfixée (puisqu'elle intervient ensuite). Note que les préfixes pour Internet Explorer (ms) sont rares, Microsoft préférant n'intégrer que des propriétés valides et terminées.
Ceci est vrai pour toutes les propriétés encore non terminées, mais pour d'autres comme box-shadow et border-radius, tu peux directement te passer de propriétés préfixées et ne mettre que la propriété finale ; donc, tu peux retirer tes -moz-border-radius et -webkit-border-radius, et ne laisser que border-radius (et si tu ne les supprimes pas, mets ce dernier après les autres et non avant).
Fais donc déjà ça, et on y verra plus clair dans ton code. N'hésites pas à donner le lien du forum pour qu'on puisse vérifier également en "direct".
Alors, lorsque tu utilises des propriétés préfixées, il faut le faire dans un certain ordre ; à savoir en mettant la propriété finale en dernier. Il faut également penser à ne pas en oublier.
Donc lorsque tu fais :
- Code:
-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg);
En faisant ainsi, tu t'assures d'une part que chaque navigateur reçoive au moins une version préfixées (non stable) d'une propriété, et que si elle prend en charge la propriété finale (c'est le cas d'IE10), il utilise cette propriété en surclassant la propriété préfixée (puisqu'elle intervient ensuite). Note que les préfixes pour Internet Explorer (ms) sont rares, Microsoft préférant n'intégrer que des propriétés valides et terminées.
- Code:
-webkit-transform: rotate(15deg);
-moz-transform: rotate(15deg);
-ms-transform: rotate(15deg);
-o-transform: rotate(15deg);
transform: rotate(15deg);
Ceci est vrai pour toutes les propriétés encore non terminées, mais pour d'autres comme box-shadow et border-radius, tu peux directement te passer de propriétés préfixées et ne mettre que la propriété finale ; donc, tu peux retirer tes -moz-border-radius et -webkit-border-radius, et ne laisser que border-radius (et si tu ne les supprimes pas, mets ce dernier après les autres et non avant).
Fais donc déjà ça, et on y verra plus clair dans ton code. N'hésites pas à donner le lien du forum pour qu'on puisse vérifier également en "direct".
Re: Soucis entre firefox et opera
Bonjour Manumanu,
Tout d'abord, un grand merci pour cette aide.
Alors, voici le css retravaillé selon vos consignes
Le lien du forum concerné
http://altitudetropicale.forums-actifs.com/
Tout d'abord, un grand merci pour cette aide.
Alors, voici le css retravaillé selon vos consignes
- Code:
/* ---- Modification de la liste des membres ---- */
/* Boutons contact */
.contactUsers {
background :#6d900e;
padding:2px;
border-top: 1px solid #475803;
margin-top: -45px;}
.contactUsers img {
width: auto;
height: auto;}
/* Tabel general */
.infoUsers {
background: rgba(152,153,106,0.2);
margin-left: 55px;
padding: 5px !important;
top: -50px;
position: relative;
font-family: Verdana,Arial,Helvetica,sans-serif;
color : black;
}
.tableUsers {
box-shadow: 0px 0px 4px #ccc;
background: #c2d454;
border: 1px solid #475803;
display: inline-table !important;
width: 250px;
font-size:11px;
margin: 5px;
font-family: Verdana,Arial,Helvetica,sans-serif;
color :#475803;
border-radius: 4px;
padding: 5px;
}
/* image avatar */
.userAvatar img {
border-radius: 3px;
border: 1px solid #ddd;
width: 50px;
height: 50px;}
.userAvatar img:hover {
box-shadow: 0px 0px 4px #ccc;
-webkit-transform: rotate(15deg);
-moz-transform: rotate(15deg);
-ms-transform: rotate(15deg);
-o-transform: rotate(15deg);
transform: rotate(15deg); }
/* pseudo des membres */
.userNames {
border-bottom: 1px solid #ddd;
padding: 2px;
margin-bottom: 4px;}
/* ---- FIN modification liste des membres---- */
Le lien du forum concerné
http://altitudetropicale.forums-actifs.com/
Re: Soucis entre firefox et opera
On ne peut pas accéder à memberlist, crée un faux compte genre test / test que tu supprimeras après, pour que je puisse voir
Re: Soucis entre firefox et opera
Bonjour Manumanu, vous avez les identifiants de connexion dans ma dernière réponse. j'ai placé tout cela sous balise hide.
Merci encore pour votre aide.
Merci encore pour votre aide.
Re: Soucis entre firefox et opera
Ha, effectivement ; merci.
Alors, ça vient de la façon de positionner les éléments ; à vrai dire, je suis même étonné que Firefox et Chrome affichent ça correctement.
Trouve ceci :
Et modifie-le comme suit :
Ensuite, modifie ceci :
Par ça :
Et enfin, ajoutes ceci :
Et ça devrait être tout bon.
Alors, ça vient de la façon de positionner les éléments ; à vrai dire, je suis même étonné que Firefox et Chrome affichent ça correctement.
Trouve ceci :
- Code:
.infoUsers {
background: rgba(152, 153, 106, 0.2);
margin-left: 55px;
padding: 5px !important;
top: -50px;
position: relative;
font-family: Verdana,Arial,Helvetica,sans-serif;
color: black;
}
Et modifie-le comme suit :
- Code:
.infoUsers {
margin-left: 5px;
overflow: hidden;
background: rgba(152, 153, 106, 0.2);
padding: 5px !important;
font-family: Verdana,Arial,Helvetica,sans-serif;
color: black;
}
Ensuite, modifie ceci :
- Code:
.contactUsers {
background: #6D900E;
padding: 2px;
border-top: 1px solid #475803;
margin-top: -45px;
}
Par ça :
- Code:
.contactUsers {
clear: left;
text-align: left;
background: #6D900E;
padding: 2px;
border-top: 1px solid #475803;
margin-top: 10px;
}
Et enfin, ajoutes ceci :
- Code:
.userAvatar {
float: left;
}
Et ça devrait être tout bon.
Re: Soucis entre firefox et opera
Manumanu, que dire si ce n'est .Tout fonctionne à merveille grâce à vous. Un grand , très grand merci pour cette aide .
Dernière édition par demeter1 le Mer 10 Oct 2012 - 17:48, édité 1 fois
Re: Soucis entre firefox et opera
Je t'en prie, mais vraiment tu peux me tutoyer.
Re: Soucis entre firefox et opera
Pas de soucis Manumanu; l'habitude du vouvoiement mais dès qu'on me l'autorise, j'utilise volontiers le tutoiement.
Un grand merci pour cette aide inestimable. Je ne te fais pas la bise mais le cœur y est.
Un grand merci pour cette aide inestimable. Je ne te fais pas la bise mais le cœur y est.
Re: Soucis entre firefox et opera
Pense à mettre ton sujet en résolu et n'hésites pas à marquer les posts qui t'ont aidé, si jamais ça peut aider quelqu'un d'autre (bien que le sujet soit assez spécifique en fait).
Sujets similaires
» soucis de déformation entre chrome et safari/firefox
» [Adresse introuvable] Plus accès à mon forum
» mise en page différente sous firefox et sous opéra ??
» Problème d'affichage entre IE et firefox
» Problème apparence entre chrome et firefox
» [Adresse introuvable] Plus accès à mon forum
» mise en page différente sous firefox et sous opéra ??
» Problème d'affichage entre IE et firefox
» Problème apparence entre chrome et firefox
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum