5568 sujets

Sémantique web et HTML

Bonjour à tous,
alors en utilisant une liste ul, je constate un décalage vers la gauche d'une liste sous IE concernant le retour à la ligne; décalage qui n'apparait pas sous Firefox et Opera.

Un schéma pour être clair:

sous IE7:

  element 1
  element 2
  element 3 
element 3_bis
 element 4

avec les autres navigateurs

  element 1
  element 2
  element 3 
  element 3_bis
  element 4


avec le css suivant:

ul{
        width:600px;
	margin-left:0px; 
	padding-left:0px;
	list-style:none;
}
li{
        list-style:none;
	list-style-type:none;
	padding-top:10px;
	padding-bottom:10px;
}

On constate donc qu'à la ligne 3, le retour à la ligne est réalisé comme si la puce était présente alors qu'il n'y en a pas.

Evidemment, j'ai regardé dans la faq et me suis inspiré de ceci
http://forum.alsacreations.com/faq/faq-54-Comment-corriger-un-espace-a-gauche-d039une-liste-different-entre-IE-Firefox-et-Opera-.html
Mais cela ne change rien.

Je continue mes recherches, si vous avez des suggestions, des liens, voire une soluce je suis preneur.

Merci d'avance.

EDIT: une solution pas très propre serait d'utiliser une table pour chaque li mais franchement non seulement, c'est pas propre mais en plus cela alourdirait considérablement le code ce que j'aimerai éviter.

EDIT2: j'avais oublié, un "list-style-position:outside;" ne change rien Smiley ohwell

EDIT Final:
Voici la solution trouvée:

ul{
        width:600px;
	margin-left:0px; 
	padding-left:0px;
	display:list-item; 
}
li{
        list-style:none outside;
	padding-top:10px;
	padding-bottom:10px;
}


Voilà. Smiley smile
Modifié par zempa (28 May 2007 - 11:36)
Alors là je dois dire merci !

En plus vous faites les questions réponses !!
J'avais le même problème et je pense que ça doit être nouveau sur IE7, j'avais pas vu ce cas de figure avant.

Merci en tout cas !