28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit souci que j'espére vous allez m'aider à résoudre Smiley lol :

J'ai une image qui se répète horizontalement dans mon body
J'ai une grande image de fond dans une div principale
J'ai une dernière div qui contient mon site

Je veux tout centrer horizontalement. Tout est ok avec FF et IE7 mais avec IE 6 la div du site est décallée vers la gauche voici mon code :

body {	padding: 0px;
	margin:	0px;
	height: 100%;
	background: #70220e url(../images/contenu.jpg) repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	
	}


#page {	background-image: url(../images/fond.jpg);
	background-position: top center;
	background-repeat: no-repeat;
	width: auto;
	height: 650px;
	padding: 0px;
	margin: 0px auto;
			
	
}


#site {	position: relative;
	margin: 0px auto;
	width: 912px;
	min-height: 100%;
	/*background-color: #70220e;*/
	
}


Et pour la page :

...
<body>
<div id="page">
<div id="site">
<div id="header"></div>
	etc...
   </div>
</div>
</body>  


Voilà, auriez vous une piste ?
Merci pour votre aide
Bonsoir,

Une piste au hasard: il s'agit d'une page de test sans Doctype et donc interprétée en mode de compatibilité (mode Quirks) par les navigateurs, ce qui fait que le centrage ne marche pas dans IE.

Allez, je vais dire que j'ai une chance sur deux d'être tombé juste.
<!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>

........ Smiley hum alors ?
Et donc, où est le patient chère Madame? Nous autres vaillants médecins aurons bien du mal à ausculter votre fiston si vous persistez à ne pas l'amener en consultation. Smiley lol

(Autre essai au pif: un élément dans le contenu dépasse allègrement à droite et, dans IE6, élargit le conteneur au lien d'en dépasser.)
Modifié par Florent V. (02 Dec 2008 - 00:16)
Un autre essai : ajouter ça :


#page
{
	text-align: center;
}


Edit : évidemment, ensuite ça suppose de réaligner le texte partout là où il doit pas être centré Smiley biggol
Modifié par mistike (02 Dec 2008 - 06:29)
mistike a écrit :
Un autre essai : ajouter ça :


#page
{
	text-align: center;
}

En général c'est plutôt sur body, et ça concerne le centrage horizontal dans IE5 et dans IE6 en mode Quirks uniquement (en mode standard -> marges automatiques).
Rien n'a fonctionné.

Par contre, en ajoutant un décallage à
position: relative;
j'obtiens l'effet escompté...

Ca me parait être franchement du bricolage mais bon Smiley ohwell
pan a écrit :
Rien n'a fonctionné.

Et tu n'as rien montré. Au revoir, donc. Je préfère ne pas jouer plus longtemps au jeu des devinettes, ça fait perdre un temps fou.

pan a écrit :
Ca me parait être franchement du bricolage mais bon Smiley ohwell

Ça l'est. D'ailleurs je doute que ça passe si tu changes la largeur de la fenêtre du navigateur, si?
Modifié par Florent V. (02 Dec 2008 - 11:52)
Florent V. a écrit :

Et tu n'as rien montré. Au revoir, donc. Je préfère ne pas jouer plus longtemps au jeu des devinettes, ça fait perdre un temps fou.


Ça l'est. D'ailleurs je doute que ça passe si tu changes la largeur de la fenêtre du navigateur, si?


Oui ça reste en place, ça m'étonne aussi.

Désolé pour le code, je ne peux pas montrer la page sur le forum...

Merci quand même pour votre aide Smiley cligne