28220 sujets

CSS et mise en forme, CSS3

Bonjour a tous, voici un probleme que je retrouve sur un de mes sites...pour faire plus simple je vous ai préparé une mise en page qui illlustre bien mon soucis

<html>
<head>
<style type="text/css">
#A{
        padding: 0;
	width: 700px;
	border: 1px solid blue;
}

#B{
	float: left;
	width: 150px;
	height: 400px;
	border: 1px solid red;
}

#C{
	float: right;
	width: 400px;
	height: 400px;
	border: 1px solid green;
	margin: 0 15px 0 0;
}
</style>
</head>

<body>
<div id="A">
	<div id="B">B</div>
	<div id="C">C</div>
	<div style="clear:both;"></div>
</div>
</body>
</html>


Concretement, l'element C se place mal sous IE, la margin est doublée, a moins que se soit firefox qui se plante...Pourriez vous me dire ce qui ne va pas car la, je seche...
edit: ajout du padding a 0 pour A.
Modifié par Arjii (21 Jul 2005 - 11:29)
Bonjour et bienvenue Arjii,

Ce problème des doubles marges est abordé dans positioniseverything: The IE Doubled Float-Margin Bug ainsi qu'une solution.

Dans le principe il faut rajouter un "display:inline" au bloc flottant, ce qui ramenera IE à la raison sans perturber les autres navigateurs qui devraient ignorer cet déclaration. Enfin je crois Smiley cligne .
Modifié par Igor (21 Jul 2005 - 11:23)
Que dire sinon un grand merci a toi!

Je n'étais pas au courant pour ce bug, c'est chose faite maintenant.
Bilan : un bug résolu, une mine d'information de trouvée, et la découverte d'une communauté active!

Merci!
Merci à toi aussi, un nouveau membre qui d'entrée met un résolu. Bravo Smiley ravi . (private modo joke) Smiley lol