18041 sujets

Questions générales et questions de débutants

[Resolu] Explorer et Firefox

Bonsoir,

Je sais que c'est mon deuxième topics ce soir, mais promis le dernier.

Vu que je ne travail que sur firefox, lorsque je me suis dit tiens je vais voir ce que ça donne sous ce explorer, j'ai failli tombé de ma chaise Smiley biggol

Et je ne suis pas très fort en résolution de bug entre navigateur, enfin au lieu d'utiliser les mots, je préfère vous montrer :

Sous Firefox (aucun bug) :
http://images2.hiboox.com/images/4207/15sjwwpf.png

Sous Explorer (décalage entre l'image et son reflet) :
http://images2.hiboox.com/images/4207/81koxlx3.png

Donc comme vous pouvez le voir, j'ai deux image collées. Par exemple une "liens" et une autre "liens_reflets" mais voila sous FF tout es bien collé mais sous IE ca se décalle...

Voici mon CSS : 

body
{
   width: 800px; /* Largeur de notre Site */
   margin:auto; /* Centrer notre Site */
   margin-top: 1.5%; /* Pour éviter de coller avec le haut de la fenêtre du navigateur */
   margin-bottom: 1.5%; /* Idem pour le bas du navigateur */
   background-color:#000000;
   background-repeat:no-repeat;
}

#corps
{
   width: 800px;
   height: 581px;
   float:left;
   margin-right:10px;
   background-image: url("images/fond.png");
   background-repeat: no-repeat; 
}

#acceuil_texte
{
   width: 500px;
   height: 193px;
   float:left;
   margin-top:80px;
   margin-left:150px;
   background-repeat: no-repeat; 
}

#acceuil_logo
{
   width: 35px;
   height: 36px;
   float:right;
   margin-top:83px;
   margin-right:125px;
   background-repeat: no-repeat; 
}

#photographies
{
   width: 158px;
   height: 30px;
   float:left;
   margin-top:100px;
   margin-left:172px;
   background-repeat: no-repeat; 
}

#photographies_reflet
{
   width: 158px;
   height: 23px;
   background-repeat: no-repeat; 
}

#images
{
   width: 80px;
   height: 29px;
   float:left;
   margin-top:101px;
   margin-left:80px;
   background-repeat: no-repeat; 
}

#images_reflet
{
   width: 80px;
   height: 23px;
   background-repeat: no-repeat; 
}

#liens
{
   width: 58px;
   height: 32px;
   float:left;
   margin-top:98px;
   margin-left:75px;
   background-repeat: no-repeat; 
}

#liens_reflet
{
   width: 58px;
   height: 23px;
   background-repeat: no-repeat; 
}


Et voici mon code HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" lang="fr" content="Seb"/>
<meta name="Description" content="Seb's Portfolio: Mes créations, mes photos, mes liens..."/>
<meta name="Identifier-URL" content="  http://www.xxxx.free.fr"/>
 
<meta name="Copyright" content="COPYRIGHT Seb's Portfolio 2007-2008 "/>
<meta name="Keywords" content="Portfolio, Seb's Portfolio, sebastien richard"/>
<meta http-equiv="content-language" content="french" />

<link rel="shortcut icon" type="image/gif" href="images/favicon.gif" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" /> 


<title>Seb's Portfolio</title>
</head>
<body>

<div id="corps">
 
 <div id="photographies">
 <a href="http://www.cder-immo/photographies"><img src="images/photographies.png" alt="Photographies" style="border:none" /></a>
 
 
 <div id="photographies_reflet">
 <img src="images/photographies_reflet.png" />
 </div>
 </div>
 
  <div id="images">
 <a href="http://www.cder-immo/images"><img src="images/images.png" alt="Images" style="border:none" /></a>
 <div id="images_reflet">
 <img src="images/images_reflet.png"/>
 </div>
 </div>
 
  <div id="liens">
 <a href="http://www.cder-immo/liens"><img src="images/liens.png" alt="Liens" style="border:none" /></a>
 <div id="liens_reflet">
 <img src="images/liens_reflet.png" />
 </div>
 </div>
   
 <div id="acceuil_texte">
 <img src="images/texte_acceuil.png"/> 
 </div>
 
 
  <div id="acceuil_logo">
 <a href="http://iut.univ-mlv.fr/ "target="_blank"><img src="images/logo.png" alt="IUT" title="IUT de Marne la Valée"  style="border:none" />  </a>
 </div>
 
</div>



</body>

</html>


Encore merci de votre aide et de votre patience Smiley smile
Modifié par Cocopop (22 Oct 2007 - 00:18)
Cocopop a écrit :
Personne n'a déjà rencontrée cette erreur ?

Si quelqu'un l'a déjà rencontrée, elle se trouve peut-être dans la FAQ? Par exemple sous l'intitulé «Espaces indésirables sous les images»? Smiley cligne
Merci Florent de ton conseils, mais j'avais déja regardé et rien ne marchait.

Mais la par pur hazard, j'ai tout fusionner en 1 bloc, donc l'image + le reflet et ca marche nikel.

En tout cas merci
Sujet clos
Aller à