28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai une fois de plus un soucis sous IE. Mon float ne positionne en dessous au lieu d'être à droite.
J'ai deux zones, une à gauche, une à droite
J'ai mis un float left à gauche et une margin-left de la longueur de la zone de gauche.

Ca fonctionne très bien sous FF et pas sous IE. Que faut-il faire d'autres ?

Merci de votre aide

Voici mon code :

<!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>
<style type="text/css">
<!--
* { margin:0; margin:0;}
body{ font-size:62.5%; font:Arial, Helvetica, sans-serif; margin:0px; padding:0px; background:black; }
#container { margin:0 auto; width:790px; }
#header { height:61px; width:790px; }
#logo, #jour_essai { height:61px; }
#logo { background:yellow; width:610px; float:left; }
#jour_essai { background:red; width:180px; margin-left:610px;}
-->
</style>
</head>
<body>
	<div id="container">
		<div id="header">
			<div id="logo"></div>
			<div id="jour_essai"></div>
		</div><!-- /header -->
	</div>
</body>
</html>


Modifié par statvg (04 Jul 2006 - 16:53)
Avec les flottants, ce genre de comportement vient toujours du fait qu'il n'y a pas assez de place pour caser toutes les boîtes flottantes (et dans la boîte on compte les marges).

Dans ton cas, c'est un bug de HasLayout avec IE. Ton conteneur de droite est doté de layout car il a une dimmension fixe (ici une largeur), et perd donc la capacité à se glisser par dessous le flottant (ou alors le flottant ne peut pas flotter par dessus un bloc doté de layout, ce qui revient au même).

Si tu peux te passer de ta largeur fixe, ça devrait résoudre le problème. Normalement, dans un conteneur dont la largeur est connue, le fait de donner une marge à gauche à ton bloc devrait suffire à en déduire une largeur.

Sinon, tu passes le bloc en float: right, mais dans ce cas il faudra supprimer la marge à gauche, qui fait que la boîte ne tient pas dans l'espace laissé par la première boîte flottante à gauche.