28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je viens vers vous pour un pb dont je ne vois pas le bout ! J'ai fais une recherche sur le forum mais je ne trouve pas d'indices !!

Je suis en train de refondre le site de ma boite pour lui redonner un coup de jeune.
j'ai un pb de comportement des DIV entre FF/Safari/Chrome.. ou ça va très bien et IE 7 et 8 qui me pourrissent la vie et réagissent différemment (avec l'affichage de compatibilité)

J'ai une DIV conteneur (#cont2) dans laquelle je viens placer 6 bloc (#bloc) en 2 colonnes X 3 Lignes
dans chacun de ces bloc, je place une photo (#photo) sur la gauche, un texte (#texte) sur la droite et un prix (#prix) en dessous de #texte qui est moins haute que #photo

içi: http... obile.fr/occasions/marques/modeles/

si le placement est nickel avec les 3 navigateurs non Krosoft... je ne comprends pas pourquoi l'affichage avec ie part en sucette ! j'ai essayé quelques modifs sans succès ...

Est-ce que l'un de vous peut me mettre le nez dans mon erreur ?? Smiley cligne

php:

<div id="cont1">
<div id="cont2">

 	
		$requete ... etc etc 
			
			echo '<div id="bloc">'."<a href='details.php?id=$IDVO[$i]'>".'<div id="photo">'."<img src='../../../photos/$IDVO[$i]1.jpeg' width='240'>".'</div>'.'<div id="logo">'."<img src='../../../marques/$Marque[$i].gif' width='35'>".'</div>'.'<div id="texte">'.'<h3>'.$Marque[$i].'</h3>'.'<br />'.$Modele[$i]." ".$Version[$i].'<br />'.$MEC1[$i]."/".$MEC2[$i]." - ".$klm[$i]." km.".'<br />'.'<h4>'.$options[$i]."..."." ".'</u>'.'</h4>'.'</a>'.'</div>'.'<div id="prix">'.$prix[$i]." €".'</div>'.'</div>';
					
...



</div>

</div>
 



CSS:

div#cont1 {
text-align:center;
}

div#cont2 {
text-align:center;
/*background-color:#33FFFF;>*/
margin-left: auto;
margin-right: auto;
float:left;
width:1000px;
height:auto;
margin-top:10px;
margin-bottom:10px;
font-weight: bold;
font-family: arial, verdana, sans-serif;
font-size: 14px;
}

div#bloc {
/* background-color:#666600;*/
position:relative;
float:left;
width:440px;
height:auto;
margin-left:40px;
margin-top:10px;
margin-bottom:10px;
}

div#photo {
/*background-color:#00CC00;*/
float:left;
z-index:1;
width:240px;
height:190;
margin-left:5px;
margin-top:5px;
margin-bottom:5px;
}

div#logo {
position:absolute;
z-index:2;
margin-left:17px;
margin-top:5px;
}

div#texte {
text-align:left;
/*background-color:#66CC33;*/
height:130px;
margin-left:250px;
color:#FFFFFF;
width:180px;
font-weight: bold;
font-family: arial, verdana, sans-serif;
font-size: 12px;


}

div#prix {
float:left;
width:180px;
background-color:#333333;
color:#FFFFFF;
height:auto;
margin-left:5px;
margin-top:5px;
text-align:center;
font-weight: bold;
font-family: arial, verdana, sans-serif;
font-size: 18px;
}


Je ne suis pas webmaster pro (vous vous en serez rendu compte Smiley cligne ) mais c'est la 1ère fois que je suis confronté à ce pb !!!

Merci de vos lumières

Eric
Modifié par Spacemarmotte (12 Oct 2010 - 17:58)
Bonjour,

L'affichage de compatibilité pour IE7/8 n'est pas vraiment une bonne chose (ça se résume à leur demander de se comporter comme IE6/7).

Avant de pouvoir t'aider, il faudrait que tu valide ton code. Le problème se trouve d'ailleurs peut-être dans une des erreurs de ton code, en effet, lorsque le code HTML n'est pas valide, c'est le navigateur qui va faire de son mieux pour essayer de le corriger, IE n'est pas très doué à cet exercice et de nombreux problèmes d'affichages sont causé par une correction incorrecte (mais du coup, c'est pas tellement de sa faute).
Merci Laurie-Anne,

désolé pour cette réponse tardive mais j'ai suivi tes conseils ...
la validation W3C est un sport de combat !!

Eric