Page HTML différente entre Chrome et Firefox
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
Page HTML différente entre Chrome et Firefox
Bonjour,
Je viens de coder une fiche de pub pour mon forum (fiche qu'on s'échange entre partenaire) sous chrome et suis arrivé au résultat voulu mais voila qu'en regardant ma fiche sous firefox le rendu n'est pas du tout le même pour ne pas tout simplement dire qu'il est dégueulasse. Alors voila, je ne comprends pas pourquoi une telle différence d'affichage entre les deux navigateurs surtout que je me suis servis exactement du même codage pour faire un PA qui lui s'affiche parfaitement bien sous chrome et firefox.
Voici la page de mon codage: http://blackeden.forumactif.org/h1-fiche-pub-black-eden-n1
et mon code:
Merci d'avance pour votre aide.
Je viens de coder une fiche de pub pour mon forum (fiche qu'on s'échange entre partenaire) sous chrome et suis arrivé au résultat voulu mais voila qu'en regardant ma fiche sous firefox le rendu n'est pas du tout le même pour ne pas tout simplement dire qu'il est dégueulasse. Alors voila, je ne comprends pas pourquoi une telle différence d'affichage entre les deux navigateurs surtout que je me suis servis exactement du même codage pour faire un PA qui lui s'affiche parfaitement bien sous chrome et firefox.
Voici la page de mon codage: http://blackeden.forumactif.org/h1-fiche-pub-black-eden-n1
et mon code:
- Code:
<style>
body, tr, td {
cursor: crosshair;
font-family: calibri;
font-size: 12pt;
font-color: #40313B;}
a:link {color: #6B323A;}
a:visited {color: #6B323A;}
a:hover {color: #40313B;}
a:active {color: #40313B;}
.fondtitreforumpa{
margin:30px;
padding:-20px;
text-align:center;
position:relative;
line-height:10px;
box-shadow:0 15px 0 0 #6B323A inset;
width:500px;
}
.fondtitreforumpa span{
background-color:#6B323A;
padding:0 0px;
}
.titreforumpa {
font-size: 60px;
font-family: 'Shadows Into Light', cursive;
text-shadow: 2px 2px 0px #B1AAB5;
color: #40313B;
}
.cadrepa {
background-color: #E8E4ED;
box-shadow: 0px 0px 5px #E8E4ED;
font-family: calibri;
font-size: 12px;
color: #40313B;
display: block;
padding-left: 10px;
padding-right: 10px;
text-align:justify;
line-height: 15px;
border-bottom: 2px solid #40313B;
}
.titrepa {
font-size: 20px;
letter-spacing : 10px;
font-family: 'Shadows Into Light', cursive;
text-shadow: 1px 1px 0px #B1AAB5;
text-align:center;
color: #40313B;
background-color : #6B323A;
border: 1px solid #6B323A;
}
#navigationPA {
width: 140px;
height : 20px;
line-height:20px;
list-style: none;
margin: 0;
padding: 0;
}
#navigationPA li {
background: #E8E4ED;
color: #40313B;
padding: 4px 0 ;
}
#navigationPA li a {
display: block;
background: #E8E4ED;
color: #40313B;
font-family: calibri;
text-align: center;
text-decoration: none!important;
}
#navigationPA li a:hover, #navigationPA li a:focus, #navigationPA li a:active {
background: #6B323A;
color: #B1AAB5;
height : 20px;
line-height:20px;
text-decoration: none!important;
text-transform: uppercase;
font-weight: bold;
}
.textessimage {
background-color: #6B323A;
width: 50px;
height: 80px;
overflow: auto;
font-family: calibri;
font-size: 10px;
color: #E8E4ED;
text-align:center;
}
.imagesrtexte a {
color: #E8E4ED;
}
.imagesrtexte img {
margin-top: -80px;
transition: transform 5s;
-moz-transition: -moz-transform 5s;
-o-transition: -o-transform 5s;
-webkit-transition: -webkit-transform 5s;
}
.imagesrtexte:hover img {
display: none;
}
::-webkit-scrollbar {
height: 3px;
width: 10px;
background-color: #D8D8D8; /* couleur de fond */
}
html > ::-webkit-scrollbar {
width: 5px; /* largeur de la barre */
}
::-webkit-scrollbar-thumb {
background: #6B323A; /* couleur de la barre qui se déplace */
}
::-webkit-scrollbar-track-piece {
background-color: #D8D8D8; /* couleur de fond */
}
</style>
<head>
<title>Nom de Votre Forum</title>
</head>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<body bgcolor="#D8D8D8">
<center><div class="fondtitreforumpa"><span><div class="titreforumpa"> Nom De Votre Forum </div></span></div>
<table>
<tr>
<td rowspan="2"><div class="titrepa">Navigation</div><div class="cadrepa" style="width:150px;">
<br /><center><div style="height:311px; padding: 3px; overflow: auto;">
<ul id="navigationPA">
<li><a href="http://" title="aller au menu 1">Menu 1</a></li>
<li><a href="http://" title="aller au menu 2">Menu 2</a></li>
<li><a href="http://" title="aller au menu 3">Menu 3</a></li>
<li><a href="http://" title="aller au menu 4">Menu 4</a></li>
<li><a href="http://" title="aller au menu 5">Menu 5</a></li>
<li><a href="http://" title="aller au menu 6">Menu 6</a></li>
<li><a href="http://" title="aller au menu 7">Menu 7</a></li>
<li><a href="http://" title="aller au menu 8">Menu 8</a></li>
<li><a href="http://" title="aller au menu 9">Menu 9</a></li>
<li><a href="http://" title="aller au menu 10">Menu 10</a></li>
</ul></div></center></div>
</td>
<td colspan="2"><div class="titrepa">Contexte</div><div class="cadrepa" style="width:350px;overflow: auto;">
<br /><center><div style="height:200px; padding: 3px; overflow: auto; text-align:justify;">
bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla
<br /><br /><a href="http://" class="postlink" target="_blank" rel="nofollow"> >> Lire la suite ? </a>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="2"><div class="titrepa">Statistiques</div><div class="cadrepa" style="width:350px;overflow: auto;">
<br /><center><div style="height:50px; padding: 3px; overflow: auto; text-align:justify;">
Le forum compte <font color="#6B323A"><span class="FORUMCOUNTUSER"></span> Membres</font> qui ont posté <font color="#6B323A"><span class="FORUMCOUNTPOST"></span> messages</font>. Le dernier inscrit est <font color="#6B323A"><span class="FORUMLASTUSER"></span></font>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="3"><div class="titrepa">Nos vacants libres</div><div class="cadrepa" style="width:524px; overflow: auto;">
<br /><center><div style="height:100px; padding: 3px; overflow: auto; text-align:center;">
<center><table>
<tbody>
<tr>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
</tr>
</tbody>
</table></center>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="3"><div class="titrepa">Nous Lier</div><div class="cadrepa" style="width:524px; overflow: auto;">
<br /><center><div style="height:50px; padding: 3px; overflow: auto; text-align:center;">
<a href="http://blackeden.fr/" class="postlink" target="_blank" rel="nofollow" title="Black Eden"><img border="0" src="http://kiarie.free.fr/eden/images/link/88x31-20.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #2"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #3"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #4"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a>
</div></center></div>
</td>
</tr>
</table><div style="font-family: calibri; font-size: 12px; color: #40313B;">Fiche Créée par KIARIE de <a href="http://blackeden.fr">BLACK EDEN</a></div></center><br /></body>
Merci d'avance pour votre aide.
Dernière édition par kiarie le Mer 16 Mar 2016 - 23:46, édité 1 fois
Re: Page HTML différente entre Chrome et Firefox
Bonsoir,
Lorsque vous créez une page HTML, il y a une certaine structure à respecter pour que votre page soit affichée de façon optimale.
Essayez avec cette structure :
J'ai mis votre codage dans cette nouvelle structure, est-ce que le résultat est différent sous Firefox ?
Cordialement,
horusbk
Lorsque vous créez une page HTML, il y a une certaine structure à respecter pour que votre page soit affichée de façon optimale.
Essayez avec cette structure :
- Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
// votre css
</style>
</head>
<body>
// votre code html
</body>
</html>
J'ai mis votre codage dans cette nouvelle structure, est-ce que le résultat est différent sous Firefox ?
- Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
<style>
body, tr, td {
cursor: crosshair;
font-family: calibri;
font-size: 12pt;
font-color: #40313B;}
a:link {color: #6B323A;}
a:visited {color: #6B323A;}
a:hover {color: #40313B;}
a:active {color: #40313B;}
.fondtitreforumpa{
margin:30px;
padding:-20px;
text-align:center;
position:relative;
line-height:10px;
box-shadow:0 15px 0 0 #6B323A inset;
width:500px;
}
.fondtitreforumpa span{
background-color:#6B323A;
padding:0 0px;
}
.titreforumpa {
font-size: 60px;
font-family: 'Shadows Into Light', cursive;
text-shadow: 2px 2px 0px #B1AAB5;
color: #40313B;
}
.cadrepa {
background-color: #E8E4ED;
box-shadow: 0px 0px 5px #E8E4ED;
font-family: calibri;
font-size: 12px;
color: #40313B;
display: block;
padding-left: 10px;
padding-right: 10px;
text-align:justify;
line-height: 15px;
border-bottom: 2px solid #40313B;
}
.titrepa {
font-size: 20px;
letter-spacing : 10px;
font-family: 'Shadows Into Light', cursive;
text-shadow: 1px 1px 0px #B1AAB5;
text-align:center;
color: #40313B;
background-color : #6B323A;
border: 1px solid #6B323A;
}
#navigationPA {
width: 140px;
height : 20px;
line-height:20px;
list-style: none;
margin: 0;
padding: 0;
}
#navigationPA li {
background: #E8E4ED;
color: #40313B;
padding: 4px 0 ;
}
#navigationPA li a {
display: block;
background: #E8E4ED;
color: #40313B;
font-family: calibri;
text-align: center;
text-decoration: none!important;
}
#navigationPA li a:hover, #navigationPA li a:focus, #navigationPA li a:active {
background: #6B323A;
color: #B1AAB5;
height : 20px;
line-height:20px;
text-decoration: none!important;
text-transform: uppercase;
font-weight: bold;
}
.textessimage {
background-color: #6B323A;
width: 50px;
height: 80px;
overflow: auto;
font-family: calibri;
font-size: 10px;
color: #E8E4ED;
text-align:center;
}
.imagesrtexte a {
color: #E8E4ED;
}
.imagesrtexte img {
margin-top: -80px;
transition: transform 5s;
-moz-transition: -moz-transform 5s;
-o-transition: -o-transform 5s;
-webkit-transition: -webkit-transform 5s;
}
.imagesrtexte:hover img {
display: none;
}
::-webkit-scrollbar {
height: 3px;
width: 10px;
background-color: #D8D8D8; /* couleur de fond */
}
html > ::-webkit-scrollbar {
width: 5px; /* largeur de la barre */
}
::-webkit-scrollbar-thumb {
background: #6B323A; /* couleur de la barre qui se déplace */
}
::-webkit-scrollbar-track-piece {
background-color: #D8D8D8; /* couleur de fond */
}
</style>
<title>Nom de Votre Forum</title>
</head>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<body bgcolor="#D8D8D8">
<center><div class="fondtitreforumpa"><span><div class="titreforumpa"> Nom De Votre Forum </div></span></div>
<table>
<tr>
<td rowspan="2"><div class="titrepa">Navigation</div><div class="cadrepa" style="width:150px;">
<br /><center><div style="height:311px; padding: 3px; overflow: auto;">
<ul id="navigationPA">
<li><a href="http://" title="aller au menu 1">Menu 1</a></li>
<li><a href="http://" title="aller au menu 2">Menu 2</a></li>
<li><a href="http://" title="aller au menu 3">Menu 3</a></li>
<li><a href="http://" title="aller au menu 4">Menu 4</a></li>
<li><a href="http://" title="aller au menu 5">Menu 5</a></li>
<li><a href="http://" title="aller au menu 6">Menu 6</a></li>
<li><a href="http://" title="aller au menu 7">Menu 7</a></li>
<li><a href="http://" title="aller au menu 8">Menu 8</a></li>
<li><a href="http://" title="aller au menu 9">Menu 9</a></li>
<li><a href="http://" title="aller au menu 10">Menu 10</a></li>
</ul></div></center></div>
</td>
<td colspan="2"><div class="titrepa">Contexte</div><div class="cadrepa" style="width:350px;overflow: auto;">
<br /><center><div style="height:200px; padding: 3px; overflow: auto; text-align:justify;">
bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla
<br /><br /><a href="http://" class="postlink" target="_blank" rel="nofollow"> >> Lire la suite ? </a>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="2"><div class="titrepa">Statistiques</div><div class="cadrepa" style="width:350px;overflow: auto;">
<br /><center><div style="height:50px; padding: 3px; overflow: auto; text-align:justify;">
Le forum compte <font color="#6B323A"><span class="FORUMCOUNTUSER"></span> Membres</font> qui ont posté <font color="#6B323A"><span class="FORUMCOUNTPOST"></span> messages</font>. Le dernier inscrit est <font color="#6B323A"><span class="FORUMLASTUSER"></span></font>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="3"><div class="titrepa">Nos vacants libres</div><div class="cadrepa" style="width:524px; overflow: auto;">
<br /><center><div style="height:100px; padding: 3px; overflow: auto; text-align:center;">
<center><table>
<tbody>
<tr>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
<td><div class="imagesrtexte"><div class="textessimage"><strong>Prenom Nom</strong><br /><a href="http://">voir fiche</a> </div><img src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-50x80.jpg" /></div>
</td>
</tr>
</tbody>
</table></center>
</div></center></div>
</td>
</tr>
<tr>
<td colspan="3"><div class="titrepa">Nous Lier</div><div class="cadrepa" style="width:524px; overflow: auto;">
<br /><center><div style="height:50px; padding: 3px; overflow: auto; text-align:center;">
<a href="http://blackeden.fr/" class="postlink" target="_blank" rel="nofollow" title="Black Eden"><img border="0" src="http://kiarie.free.fr/eden/images/link/88x31-20.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #2"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #3"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a> <a href="http://" class="postlink" target="_blank" rel="nofollow" title="ami #4"><img border="0" src="http://kiarie.free.fr/eden/portfolio/codage/pa/pa2-88x31.jpg" alt="" /></a>
</div></center></div>
</td>
</tr>
</table><div style="font-family: calibri; font-size: 12px; color: #40313B;">Fiche Créée par KIARIE de <a href="http://blackeden.fr">BLACK EDEN</a></div></center><br /></body></html>
Cordialement,
horusbk
Re: Page HTML différente entre Chrome et Firefox
Bonsoir !
Je viens de modifier mon code en suivant vos indications et en effet ça marche très bien
Merci beaucoup pour votre aide, je ferais plus attention la prochaine fois.
Je viens de modifier mon code en suivant vos indications et en effet ça marche très bien
Merci beaucoup pour votre aide, je ferais plus attention la prochaine fois.
Sujets similaires
» soucis de déformation entre chrome et safari/firefox
» Espacement différent entre Firefox et Chrome
» Problème apparence entre chrome et firefox
» Grande difference entre IE et chrome ou firefox
» Décalage de css des entêtes de catégories entre Firefox et Chrome
» Espacement différent entre Firefox et Chrome
» Problème apparence entre chrome et firefox
» Grande difference entre IE et chrome ou firefox
» Décalage de css des entêtes de catégories entre Firefox et Chrome
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