[CSS 2] Centrer un bloc div pour Internet Exporer [Résolu]

vg-matrix · 16/06/2011, 13h36

Salut tout le monde, j'ai un problème, IE n'arrive pas à centrer un bloc div avec le code suivant:

Code :

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

1
2
3
.bas { width:900px;
	height:25px;
	margin:auto;}

Pourtant il marche bien sous Google Chrome et Mozilla Firefox

Que dois-je faire s'il vous plaît?

Bisûnûrs · 16/06/2011, 13h59

Mettre un DOCTYPE ?

vg-matrix · 16/06/2011, 14h26

Voici le doctype que j'utilise:

Code :

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

1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">

Bisûnûrs · 16/06/2011, 14h35

Tu n'as rien au-dessus du DOCTYPE ? Une déclaration XML, une marque BOM, des espaces (IE6) ?
Et de quelle version de IE tu parles ?

vg-matrix · 16/06/2011, 15h19

Citation:

Envoyé par Bisûnûrs

Tu n'as rien au-dessus du DOCTYPE ? Une déclaration XML, une marque BOM, des espaces (IE6) ?

Non, il n'y a rien au dessus.

Citation:

Envoyé par Bisûnûrs

Et de quelle version de IE tu parles ?

J'utilise IE9.

Macmillenium · 16/06/2011, 15h21

Citation:

Envoyé par vg-matrix

Non, il n'y a rien au dessus.

Poste ton code HTML/CSS complet alors.

Bisûnûrs · 16/06/2011, 15h22

On peut avoir un code complet (mais très simplifié) représentant ton problème ? Ou une page en ligne ?

function_Help · 16/06/2011, 21h44

hello,

colle ceci dans ton <head> pour voir

Code :

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

<meta http-equiv="X-UA-Compatible" content="IE=8" />

bises

ludojojo · 17/06/2011, 17h03

Citation:

Envoyé par vg-matrix

Salut tout le monde, j'ai un problème, IE n'arrive pas à centrer un bloc div avec le code suivant:

Code :

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

1
2
3
.bas { width:900px;
	height:25px;
	margin:auto;}

Pourtant il marche bien sous Google Chrome et Mozilla Firefox

Que dois-je faire s'il vous plaît?

Bonjour,

Il me semble que IE à des difficultés avec le "margin:auto". Si tu essayes avec "text-align:center" dans une div anglobante ça donne quoi ?

Bisûnûrs · 17/06/2011, 17h12

Citation:

Envoyé par ludojojo

Il me semble que IE à des difficultés avec le "margin:auto"

Du tout non. Il suffit de mettre un DOCTYPE pour qu'il passe en mode Standard et comprenne cette instruction.

ludojojo · 17/06/2011, 17h21

Dans ce cas, qu'elle est l'influence du changement de doctype par rapport aux autres navigateurs ?

Bisûnûrs · 17/06/2011, 17h39

Hop : http://j-willette.developpez.com/tut...ge=page_1#LI-C

Macmillenium · 17/06/2011, 18h37

Citation:

Envoyé par Bisûnûrs

Il suffit de mettre un DOCTYPE pour qu'il passe en mode Standard et comprenne cette instruction.

Et pour mieux comprendre la remarque de Bisûnûrs, renseignez vous sur le doctype switching, ça vous sera très utile...

ludojojo · 17/06/2011, 18h42

OK merci pour l'info !

Ton problème est résolu pour le centrage de ta div avec le nouveau DOCTYPE?

Hyuunkel · 18/06/2011, 22h31

Hello vg-matrix, ca peux semblé anodin mais as tu tester simplement un :

Code :

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

margin-left: 50%;

Je dis ça comme ça moi je fait ainsi avec un bloc absolute et ca fonctionne nikel.

Cordialement

Bisûnûrs · 18/06/2011, 22h52

Oui enfin, faudrait arrêter de mettre des position:absolute à tout bout de champ et là où il n'y en a pas besoin .. Le positionnement absolu doit être utilisé dans des cas précis, pas pour faire de la mise en page.

Eric2a · 19/06/2011, 00h10

Citation:

Envoyé par vg-matrix

Voici le doctype que j'utilise:

Code :

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

1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">

Salut,

Le doctype XHTML 1.1 est prévu pour les documents XML servis en application/xhtml+xml et requiere donc la présence du prologue XML, lequel bascule IE en mode quircks. Il n'y a donc pas lieu de l'utiliser pour les documents HTML servis en text/html.

Ceci dit, sa présence sans le prologue XML permet à IE8 de passer en mode standard.

Il faudrait donc voir du côté de la configuration du navigateur :

Outils > Outils de développement > Mode navigateur et Mode document

N'oublie pas changer de doctype (déstiné à être servi en text/html), qu'il soit Transitionnel ou Strict :

Code html :

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

1
2
3
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

Macmillenium · 19/06/2011, 11h43

Citation:

Envoyé par Eric2a

la présence du prologue XML, lequel bascule IE en mode quircks.
Ceci dit, sa présence sans le prologue XML permet à IE8 de passer en mode standard.

Attention, la déclaration XML bascule uniquement IE6 en mode Quirks!
Ce n'est pas le cas pour IE7 et 8.

vg-matrix · 20/06/2011, 15h51

Finalement, je suis passé à ça

Code html :

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11-transitional.dtd">

et tout marche bien

16/06/2011, 21h44	#8
function_Help Invité de passage Paul Technicien maintenance Inscription : mai 2011 Messages : 9 Détails du profil Informations personnelles : Nom : Paul Localisation : France, Hérault (Languedoc Roussillon) Informations professionnelles : Activité : Technicien maintenance Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : mai 2011 Messages : 9 Points : 4 Points : 4	hello, colle ceci dans ton <head> pour voir Code : Sélectionner tout - Visualiser dans une fenêtre à part <meta http-equiv="X-UA-Compatible" content="IE=8" /> bises
	04

17/06/2011, 17h21	#11
ludojojo Membre Expert Ludovic Solczynski Développeur .NET Inscription : avril 2008 Messages : 1 446 Détails du profil Informations personnelles : Nom : Ludovic Solczynski Localisation : France Informations professionnelles : Activité : Développeur .NET Secteur : Administration - Collectivité locale Informations forums : Inscription : avril 2008 Messages : 1 446 Points : 2 179 Points : 2 179	Dans ce cas, qu'elle est l'influence du changement de doctype par rapport aux autres navigateurs ? __________________ Aide les autres... Et les autres t'aideront.... Mon site DVP Mon site perso N'oubliez pas de voter pour les messages dont la réponse est pertinente
	00

17/06/2011, 18h42	#14
ludojojo Membre Expert Ludovic Solczynski Développeur .NET Inscription : avril 2008 Messages : 1 446 Détails du profil Informations personnelles : Nom : Ludovic Solczynski Localisation : France Informations professionnelles : Activité : Développeur .NET Secteur : Administration - Collectivité locale Informations forums : Inscription : avril 2008 Messages : 1 446 Points : 2 179 Points : 2 179	OK merci pour l'info ! Ton problème est résolu pour le centrage de ta div avec le nouveau DOCTYPE? __________________ Aide les autres... Et les autres t'aideront.... Mon site DVP Mon site perso N'oubliez pas de voter pour les messages dont la réponse est pertinente
	00

18/06/2011, 22h31	#15
Hyuunkel Candidat au titre de Membre du Club Technicien Supérieur en Support Informatique Inscription : juin 2011 Messages : 27 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Technicien Supérieur en Support Informatique Informations forums : Inscription : juin 2011 Messages : 27 Points : 14 Points : 14	Hello vg-matrix, ca peux semblé anodin mais as tu tester simplement un : Code : Sélectionner tout - Visualiser dans une fenêtre à part margin-left: 50%; Je dis ça comme ça moi je fait ainsi avec un bloc absolute et ca fonctionne nikel. Cordialement
	02

20/06/2011, 15h51	#19
vg-matrix Membre éprouvé Inscription : février 2007 Messages : 1 160 Détails du profil Informations personnelles : Âge : 23 Informations forums : Inscription : février 2007 Messages : 1 160 Points : 469 Points : 469	Finalement, je suis passé à ça Code html : Sélectionner tout - Visualiser dans une fenêtre à part <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11-transitional.dtd"> et tout marche bien __________________ Il est difficile de retrouver ses erreurs lorsqu'on est persuadé que son code est juste... Groupe des développeurs ivoiriens
	00

16/06/2011, 13h59	#2
Bisûnûrs Modérateur Josselin Développeur Web Inscription : janvier 2004 Messages : 9 050 Détails du profil Informations personnelles : Nom : Josselin Âge : 29 Localisation : France, Rhône (Rhône Alpes) Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : janvier 2004 Messages : 9 050 Points : 12 181 Points : 12 181	Mettre un DOCTYPE ?
	20

16/06/2011, 14h35	#4
Bisûnûrs Modérateur Josselin Développeur Web Inscription : janvier 2004 Messages : 9 050 Détails du profil Informations personnelles : Nom : Josselin Âge : 29 Localisation : France, Rhône (Rhône Alpes) Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : janvier 2004 Messages : 9 050 Points : 12 181 Points : 12 181	Tu n'as rien au-dessus du DOCTYPE ? Une déclaration XML, une marque BOM, des espaces (IE6) ? Et de quelle version de IE tu parles ?
	10

16/06/2011, 15h22	#7
Bisûnûrs Modérateur Josselin Développeur Web Inscription : janvier 2004 Messages : 9 050 Détails du profil Informations personnelles : Nom : Josselin Âge : 29 Localisation : France, Rhône (Rhône Alpes) Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : janvier 2004 Messages : 9 050 Points : 12 181 Points : 12 181	On peut avoir un code complet (mais très simplifié) représentant ton problème ? Ou une page en ligne ?
	00

17/06/2011, 17h39	#12
Bisûnûrs Modérateur Josselin Développeur Web Inscription : janvier 2004 Messages : 9 050 Détails du profil Informations personnelles : Nom : Josselin Âge : 29 Localisation : France, Rhône (Rhône Alpes) Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : janvier 2004 Messages : 9 050 Points : 12 181 Points : 12 181	Hop : http://j-willette.developpez.com/tut...ge=page_1#LI-C
	00

18/06/2011, 22h52	#16
Bisûnûrs Modérateur Josselin Développeur Web Inscription : janvier 2004 Messages : 9 050 Détails du profil Informations personnelles : Nom : Josselin Âge : 29 Localisation : France, Rhône (Rhône Alpes) Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : janvier 2004 Messages : 9 050 Points : 12 181 Points : 12 181	Oui enfin, faudrait arrêter de mettre des position:absolute à tout bout de champ et là où il n'y en a pas besoin .. Le positionnement absolu doit être utilisé dans des cas précis, pas pour faire de la mise en page.
	10

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