Aller au contenu

Image pas de la même couleur sous 2 Navigateurs différents ... Ôô


easytype

Sujets conseillés

Bonsoir à tous ! :)

Désolé, aujourd'hui j'abuse un peu du forum, mais là, un petit truc m'énerve ! :mad2::nonono:

Une de mes images mise sur mon FTP n'a pas la même couleur sous IE7 que Firefox3 Ôô

Lien de l'image : haut_corps.png

http://moe.mabul.org/up/moe/2009/04/07/img-215054wg4p8.jpg

Et rien que cela change totalement le site :

img-215247ueev0.jpg

Bizarre non ?

Aidez-moi, c'est horrible ^^

Merci

Lien vers le commentaire
Partager sur d’autres sites

C'est IE6 qui à une mauvaise gestion de la transparence, par contre, IE toute version (quoique je n'ai pas vérifié sous IE8) génère un décalage de rendu des couleurs en PNG

Lien vers le commentaire
Partager sur d’autres sites

->dadou : je te confirme avoir déjà rencontré des pb de transparences sous IE7 (SEPT) dans certaines circonstances. Il est vrai qu'il s'agit ici plus vraisemblablement d'un pb de rendu de couleur.

->easytype : tu peux essayer d'abord d'optimiser tes png, certaines versions de photoshop le gère mal.

Si tjrs pb, tu as diverse alternatives : le flash, décomposer ton image avec des png pour les détails et un bkgrnd (qui semble poser problème) dans un autre format . Sinon une bidouille avec des commentaires conditionnels.

Lien vers le commentaire
Partager sur d’autres sites

Et comment faire ? ^^

Je ne sais ou placer les balises :/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<link rel="stylesheet" type="text/css" href="css/style.css" />

</head><html>
<body>
<br>
<br>
<div class="total_corps">
<div class="corps_haut"></div>
<div class="corps">




<center><style type="text/css">
<!--
body
{
background: #303036;
}
ul, li { /* utilisation de liste pour le menu */
list-style-type: none; /* suppression des puces de liste */
margin:1;
padding:0;
}
ul {

background: transparent url(abf.jpg) top left repeat; /* arrière-plan général du menu */
width: 573px;
height: 146px;

}
li {float: left;}

li a { /* dimensions et définitions des boutons */
display: block; /* mise en block de <a> pour lui donner des dimensions */
height: 147px;
width: 191px;

}
a#lien1:hover, a#lien2:hover, a#lien3:hover {
background: transparent url(abf.jpg) top left no-repeat;
}
a#lien1:hover {
background-position: -0px 101%;
}
a#lien2:hover {
background-position: -191px 101%;
}
a#lien3:hover {
background-position: -382px 101%;
-->

</style>
</head>
</body>
<body>
<ul>
<li><a id="lien1" href="#"></a></li>
<li><a id="lien2" href="#"></a></li>
<li><a id="lien3" href="#"></a></li>
</ul></center>


</body>
</html>

<br>
<br>

</div>
</div>
<div class="corps_bas"></div>
<br>
<br>
<br>

Lien vers le commentaire
Partager sur d’autres sites

Déjà tu as plusieurs <body> dans une même page, ce qui n'est pas très correct :)

Ensuite tu devrais mettre tes <style> entre <head> et </head> pour les centraliser et rendre ton code plus lisible.

Si tu veux faire les choses bien fais une feuille de style externe, c'est encore mieu.

Modifié par Saucisson
Lien vers le commentaire
Partager sur d’autres sites

Hello, :)

Merci pour ton aide, j'ai essayé de bouger des balises et tout et tout, mais je n'y arrive pas :/

Voici mon nouveau code qui ne change rien à la page : http://jessy.houcke.free.fr/forteresse/lolilol.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">

<link rel="stylesheet" type="text/css" href="css/style.css" />

<html>
<body>
<br>
<br>
<div class="total_corps">
<div class="corps_haut"></div>
<div class="corps">

<center><head><style type="text/css">
<!--
body
{
background: #303036;
}
ul, li { /* utilisation de liste pour le menu */
list-style-type: none; /* suppression des puces de liste */
margin:1;
padding:0;
}
ul {

background: transparent url(abf.jpg) top left repeat; /* arrière-plan général du menu */
width: 573px;
height: 146px;

}
li {float: left;}

li a { /* dimensions et définitions des boutons */
display: block; /* mise en block de <a> pour lui donner des dimensions */
height: 147px;
width: 191px;

}
a#lien1:hover, a#lien2:hover, a#lien3:hover {
background: transparent url(abf.jpg) top left no-repeat;
}
a#lien1:hover {
background-position: -0px 101%;
}
a#lien2:hover {
background-position: -191px 101%;
}
a#lien3:hover {
background-position: -382px 101%;
-->


</head></style>

<ul>
<li><a id="lien1" href="#"></a></li>
<li><a id="lien2" href="#"></a></li>
<li><a id="lien3" href="#"></a></li>
</ul></center>
</body>




<br>
<br>

</div>
</div>
<div class="corps_bas"></div>
</html>

Merci :)

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...