28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous, j'ai un soucis de décalage et d'affichage de cadre sous INTERNET EXPLORER et FIREFOX MOZILLA.
Sus Mozilla, c'est nickel, mais sous Iexplorer, çà décale mon bloc.

Le premier carde blanc dans le corps de la page s'affiche bien mais, le 2ème cadre juste à coté ( pour mettre des infos ), sous FIREFOX, il s'affiche bien, mais sous IEXPLORER il me décale le cadre vers la droite. [URL="http://foot-passion94.ifrance.com/"]Voir le rendu Ici[/URL]
Je n'arrive pas à résoudre ce problème. J'ai essayé plein de modification dans mon code, mais çà marche pas. Si par exemple je fais un :
 margin-left: -10px;
ou [QUOTE]un padding-left: -10px;[/QUOTE]
Il me décale tout le cadre noir vers la gauche mais c'est plus bon, car du coup sous FIREFOX aussi il me le décalle vers la gauche et donc le cadre noir se colle avec le cadre blanc.
Voici, le code des deux cadre dont je vous parle :
Pour le cadre blanc :
[QUOTE]#cadre-photo
{
float: left;
}

.cadre-photo-haut-blanc
{
width: 350px;
height: 44px;
margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-top: 0px;
background-image: url("images/corps/box-photo-blanc-haut.jpg");
background-repeat: no-repeat;
}

.cadre-photo-centre-blanc
{
width: 350px;
margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-top: 0px;
background-image: url("images/corps/box-photo-blanc-centre.jpg");
background-repeat: repeat-y;
}

.cadre-photo-bas-blanc
{
width: 350px;
height: 44px;
margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-top: 0px;
background-image: url("images/corps/box-photo-blanc-bas.jpg");
background-repeat: no-repeat;
}[/QUOTE]
[B]Pour le cadre noir :[/B]
#cadre-noir
{
   float: left;
}
 
  .cadre-noir-partie-haute
  {
   width: 266px;
   height: 44px;
   margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-top: 0px;
   background-image: url("images/corps/box-texte-noir-haut.jpg");
   background-repeat: no-repeat;
 }  
   
  .cadre-noir-partie-centre
  {
   width: 266px;
   height: 420px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
   margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-top: 0px;
   background-image: url("images/corps/box-texte-noir-centre.gif");
   background-repeat: x-repeat;
 }  
 
  .cadre-noir-partie-basse
    {
   width: 266px;
   height: 44px;
   margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-top: 0px;
   background-image: url("images/corps/box-texte-noir-bas.jpg");
   background-repeat: no-repeat;
 }

Merci
Modifié par Zen-Spirit (04 Apr 2008 - 22:34)
Bonjour à tous ! :cry:
Y a personne pour m'aider à corriger ce problème de décalage avec Internet Explorer alors que sous Mozilla çà s'affiche très bien !
Je galère vraiment depuis 2 voir 3 jours sur ce détails là et j'avance pas. J'ai beau lire des forums ou tutos sur internet, mais je n'arrive pas à corriger ce soucis. Smiley decu
je vous laisse l'adresse pour voir ce que çà donne sous les 2 navigateurs :
http://foot-passion94.ifrance.com
Merci à vous.
Modifié par Zen-Spirit (05 Apr 2008 - 19:39)
Salut,

Ton problème c'est ça:
<script language="Javascript" type="text/javascript">
<!--
var d=new Date; rnd=d.getDay()+'-'+d.getHours(); var b=(''+location.hostname).split('.'); d=2; if(b[b.length-d+1]=='') d=3; h='web.'+b[b.length-d]+'.'+b[b.length-d+1]; 
document.write('<sc'+'ript src="http://js-perso.ifrance.com/js.php?'+rnd+'"><'+'/sc'+'ript>');
// -->
</script>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">_uacct = "UA-324340-1"; urchinTracker();</script>
<?xml version="1.0" encoding="ISO-8859-1"?>


Qui n'a rien à faire là Smiley biggol
Salut ghost !
Merci d'avoir répondu. Au moins j'ai une réponse car celà fait 3 jours que je galérai là dessus et jamais je n'aurai trouvé ce problème tout seul.
Alors par rapport à ce que tu me dis.
ce code que viens de mettre, c'est pas moi qui l'ai mis, c'est un code que l'hébergeur IFRANCE met tout seul.
Par contre, ce que je ne comprends pas, par rapport à ce que tu me dis, c'est que sous FIREFOX çà marche très bien.
En tout cas un grand merci.
Re,

A partir du moment ou il y a quelque chose (même un espace) devant ta déclaration de doctype, IE passe en mode Quirck.
Tu peux "récuperer" le centrage avec un

body{
text-align: center;
}

et faire les correctifs dans le reste du css en fonction des besoins (text-align: left;)
Ou mieux changer d'hébergement ... (30à 40€ par an ce n'est pas la mer à boire) Smiley cligne