28172 sujets

CSS et mise en forme, CSS3

Je continue ma déclaration d'amour pour IE6 ( Smiley hum Smiley mur )
2ème problème : centrage du contenu... sur une page
Pour voir mon souci, consultez ses trois pages :
Voici ce que je veux obtenir : présentation
Voici ce que j'obtiens : équipe
Et voilà ce que je ne comprend pas :le C.A.

Explication : La page avec le bon contenu est la deuxième, c'est à dire une div avec des images et une div avec du texte, les deux en float:left. Le problème est que la page s'aligne à gauche alors qu'elle devrait être centrée. Si j'intervertis l'ordre des div, j'obtiens la troisième page, centrage correct !!! Je comprends pas... Smiley help
Pour obtenir la bonne disposition, (celle du premier exemple) j'ai dû ajouter avant la première div une image gif d'un pixel. Je ne sais pas vraiment pourquoi j'ai fait ça, je ne sais encore moins pourquoi ça marche, mais... ça marche Smiley confus Le problème est que cela n'a pas de sens à mes yeux, j'aimerai éviter de mettre cette image.

voilà le code de la page avec le gif d'un pixel.
<div id="contenu">
		
			<img src="../images/pix.gif" width="1" height="1" style="margin:0" />
			<div id="icono">
				<?php include($page.'/texte1_inc.php'); ?>				
			</div>
			<div id="text1">
				<h1 id="titre_page">Pr&eacute;sentation</h1>
				<?php include($page.'/texte2_inc.php'); ?>
			</div>
			
			<div class="spacer">&nbsp;</div>
			
		</div>

...et voici le CSS
body {
	margin:0px auto;
	padding: 0px;
	background-color:#FFFFFF;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	width:936px;
	}

#contenu {
	background:url(images/fond_page.jpg) no-repeat;
	min-height:519px;
	margin-top:64px;
	padding-top:40px;
	}

#icono {
	width:200px;
	margin:0;
	text-align:center;
	}
	
#text1 {
	width:580px;
	margin: auto 120px auto 30px;
	}

Modifié par Isobel (05 May 2008 - 22:36)
Re,

Toujours pas flagrand chez moi sauf un "mauvais" centrage élimine peut être ta ligne vide avant ton doctype ie6 a tendance à passer en mode Quirk pour bien moins que cela Smiley cligne
Bonjour,

Il me semble que passer par un body en width: Npx; margin: 0 auto; pour centrer tout un site pose problème à certains navigateurs. Ce serait à confirmer. Pour ma part je passe toujours par un conteneur global (div#global, div#page, etc.) pour centrer tous les éléments d'un coup, mais c'est peut-être une mesure qui n'est plus d'actualité... À vérifier.
Merci Florent,
Le centrage via le body était effectivement en cause. Moi qui m'étais posé la question sur l'utilité d'un conteneur général alors qu'on avait le body, ben voilà !
Cela a résolu mes problèmes 1 et 2 (voir sujet CSS/IE6 problèmes (1)
La ligne vide avant le doctype, je l'ai enlevée, mais cela n'y a rien changé...

Sinon, une idée sur mon 3ième souci ? CSS/IE6 problèmes (3)
[EDIT]3ième souci résolu...
Modifié par Isobel (05 May 2008 - 22:37)