[Résolu] Bizarrerie IE et position:relative

Bonjour,

Je rencontre un problème que je ne parviens pas à m'expliquer avec ce cher IE

J'ai un code xhtml qui ressemble à ceci :

<div id="contenu">
     <ol id="menu">blahblah</ol>
     <div id="texte">blahblah</div>
</div>

le css associé est :

body{background-color:blue;}
#contenu{
margin:5px;
background-color:white;
position:relative; /* pour placer les élements dans le cadre blanc */
}
#menu{
float:left;
list-style-type:upper-roman;
font-weight:bold;
margin:0;
}

Sous Firefox, pas de problème, sous IE6 windows le #menu n'apparaît pas. J'ai cherché quelque temps et me suis rendu compte qu'il faut ajouter position:relative au #menu pour qu'il apparaisse enfin...
C'est totalement incohérent, je ne comprends pas pourquoi je suis obligé de passer le #menu en relatif. Ce n'est pas gênant pour la page en question mais ça pourrait l'être dans une autre configuration.

De plus, IE ne m'affiche pas les numéros de la liste ! Le comportement est le même si je ne spécifie pas de list-style-type...

Quelqu'un pourrait éclairer ma lanterne ?
D'avance merci,
Johan
Modifié par trasher (03 Aug 2006 - 16:24)

Par un heureux hasard, j'ai enfin trouver le moyen d'afficher les chiffres manquants de la balise ol avec IE : il suffit de spécifier un padding manuellement.

Je reste interloqué par cette étrange chose, s'agit-il d'un bug IE ou de quelque chose que j'aurais mal compris ?

Merci

a écrit :
s'agit-il d'un bug IE

IE EST un bug, signé microsoft en plus !

Je ne comprends pas ton problème réellement, t'as pas un p'tit lien pour mieux se rendre mieux compte ?

Bah c'est un vieillard IE, faut pas lui en vouloir à ce point

Bon pour les liens, voici : dans le répertoire http://x-tnd.be/prob_ie/
Le problème est situé (dans cette démo) sur la seconde liste (cv, réalisations, etc...). Le problème des accents n'est pas important, les fichiers en ligne sont des copier-coller vite fait
- cv.php5 : la version qui marche sous IE
- cv-ienums.php5 : les numéros de la liste n'aparraissent pas
- cv-iedontsee.php5 : la liste n'apparaît pas

Dans le css, c'est de la règle #summary dont il s'agit :
celle qui fonctionne est codée comme suit :

#summary{
	position:relative;
	float:left;
	clear:left;
	list-style-type:upper-roman;
	font-weight:bold;
	margin:5px 0 5px 0;
	padding:0 0 0 40px;
	width:208px;
	border:1px #6699CC dashed;
}

Si l'on enlève le padding, IE n'affiche plus les numéros, la règle devient alors :

#summary{
	position:relative;
	float:left;
	clear:left;
	list-style-type:upper-roman;
	font-weight:bold;
	margin:5px 0 5px 0;
	width:208px;
	border:1px #6699CC dashed;
}

Enfin, si l'on enlève le "position" IE n'affiche plus rien :

#summary{
	float:left;
	clear:left;
	list-style-type:upper-roman;
	font-weight:bold;
	margin:5px 0 5px 0;
	padding:0 0 0 40px;
	width:208px;
	border:1px #6699CC dashed;
}

Voilà je pense que ce sera plus clair comme cela...

J'ai rencontré le même problème, pas de numérotation pour <ol> sous IE...

Merci pour l'astuce, d'autant que ce problème n'est pas beaucoup traité sur le web, peut-être parce que les <ol> sont trop délaissées au bénéfice des <ul> ?

Bonjour,

Deux bugs se cumulent ici.

D'une part, la position float interfère avec le mécanisme de rendu propre à IE (haslayout).

D'autre part, IE5.x 6.0 n'implémente pas le rendu des listes (display:list-item) tel que le prévoie CSS. Il en fait plutôt une sorte d'émulation, en conflit à son tour avec le haslayout. Les bugs de disparition de marqueurs de liste sont fréquents (voir par exemple celui-ci).

Ta page est finalement une bonne traduction des difficultés rencontrées par Microsoft pour conjuguer dans IE5.x-6.0 deux modes de rendu en partie contradictoires (le mode CSS et le mode historique de Trident)

IE7 apporte des progrès substanciels de ce côté.
Modifié par Laurent Denis (03 Aug 2006 - 15:53)

Merci pour tes précisions Laurent Denis, cela éclairera la lanterne de tous ceux qui rencontreront ce problème à l'avenir.

Je testerai à l'occasion les pages que j'ai créées sous IE7, pour voir ce que ça donne (mais en attendant tout de même la version finale avant de crier victoire).

Je suis "heureux" Freedom_09 que mes problèmes sur ce sujet aient pu t'aider, somme toute la solution à ce problème n'est pas très compliquée maintenant que je relis ma solution ; mais il est vrai que c'est déconcertant de prime abord.

Je vous souhaite à tous une excellente continuation - dans le respect des standards bien évidemment !