[IE-FF] Div absolute centré dans la page

roots_man · 07/07/2011, 21h15

Bonjour,

Je vous expose mon problème, je désire centré mon div (qui sera mon div principale dans ma page) et que ca soit compatible FireFox&Internet Explorer !

Pour IE on est d'accord

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<body style="text-align:center;">

Pour firefox on est aussi d'accord

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="text-align:center;margin:0px auto;width:400px;height:150px;border:1px red solid;">salut</div>

Jusque la tout va bien mon div est centré dans la page au sommet de cette dernière (dans les 2 navigateurs) !

Mais maintenant je désire la décaler un peu du sommet, je pense alors a mettre un margin-top:100px; Ok la ca fonctionne toujours. Mais mon div est actuellement en position:relative; et je souhaiterai que mon div élément soit en position:absolute; Et c'est la que dans Firefox, mon div à collé a gauche et dans IE il n'est plus totalement centré, il s'est décalé vers la droite!

Si quelqu'un a une idée je suis preneur !

Merci d'avance

BByani · 07/07/2011, 22h51

Il existe un "hack css" plus simple.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<body>
          <!-- la div doit avoir une largeur -->
          <div style="height:700px; width:800px; margin-left:auto; margin-right:auto;"></div>
</body>

centrage = margin (left et right) placé en auto.

Bisûnûrs · 08/07/2011, 09h31

Citation:

Envoyé par roots_man

Pour IE on est d'accord

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<body style="text-align:center;">

Non. Si tu codes correctement et que tu as un DOCTYPE valide, c'est un subterfuge que tu n'as pas à avoir à mettre en place. Il n'est utile qu'en mode Quirks pour IE8-.

Citation:

Envoyé par roots_man

je souhaiterai que mon div élément soit en position:absolute;

Tu ne peux pas centrer un élément avec des marges automatiques s'il est en position absolu. La technique à utiliser est disponible dans cette Q/R de la FAQ :
http://css.developpez.com/faq/?page=...calement_block

07/07/2011, 21h15	#1
roots_man Membre confirmé Inscription : août 2004 Messages : 324 Détails du profil Informations forums : Inscription : août 2004 Messages : 324 Points : 227 Points : 227	[IE-FF] Div absolute centré dans la page Bonjour, Je vous expose mon problème, je désire centré mon div (qui sera mon div principale dans ma page) et que ca soit compatible FireFox&Internet Explorer ! Pour IE on est d'accord Code : Sélectionner tout - Visualiser dans une fenêtre à part <body style="text-align:center;"> Pour firefox on est aussi d'accord Code : Sélectionner tout - Visualiser dans une fenêtre à part <div style="text-align:center;margin:0px auto;width:400px;height:150px;border:1px red solid;">salut</div> Jusque la tout va bien mon div est centré dans la page au sommet de cette dernière (dans les 2 navigateurs) ! Mais maintenant je désire la décaler un peu du sommet, je pense alors a mettre un margin-top:100px; Ok la ca fonctionne toujours. Mais mon div est actuellement en position:relative; et je souhaiterai que mon div élément soit en position:absolute; Et c'est la que dans Firefox, mon div à collé a gauche et dans IE il n'est plus totalement centré, il s'est décalé vers la droite! Si quelqu'un a une idée je suis preneur ! Merci d'avance __________________ powder skiing is not a crime
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email