Version complète: sur le forum Webmaster Hub : Problème de puces sous IE
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
oberruyer
bonjour

je reviens après quelques jours de travail, grrrr (merci encore pour votre aide passée !)

refaisant mon site en XHTML (100 % Newbie), j'ai un problème avec l'affichage des puces sous IE. A un moment sur la page, les puces collent au bord sans raison :

c'est ici :

http://16types.free.fr/v2/test.html
http://16types.free.fr/v2/styles/essai.css

pourriez-vous m'aider ?

merci d'avance

Amitiés

Olivier
TheRec
Bonsoir,

à vue d'oeuil...et en essayant de valider ta page, voici un début de réponse à ta question :
CITATION
Line 67, column 5: document type does not allow element "br" here; assuming missing "li" start-tag .

Dans les listes qui sont collée à gauche tu as inséré (en dehors des élements <li> mais dans une balise <ul>) des retours à la ligne (<br>), dans Internet Explorer cela n'est pas corrigé de la manière par le moteur de rendu que ça l'est dans Firefox ou Opera...

Si tu veux vraiment avoir des retour à la ligne dans une liste non-ordonée (<ul>) il faut qu'il soient contenus dans une balise <li>...

Tes balises <meta> doivent être fermée... il en va de même pour les balises <img>, c'est une des particularité de XHTML 1.0 par rapport à HTML4.01...

Une fois ces problèmes réglés il y a des chances que cela fonctionne...on verra wink.gif
TheRec
J'ai pris le temps de corriger tout ceci en local (ça te prendra pas longtemps)...

Cela ne règle pas le problème de premier abord...mais ensuite il suffit d'ajouter au moins 1px de padding-top à l'élément <ul> ...et le problème est réglé...

CODE
#corps ul {
    list-style-type:disc;
    padding: 1px 0 0 0;
    margin: 0px;
    margin-left: 40px;  
    text-align: justify;
}


Apparemment IE fait sortir ces listes du flux du document car l'élément n'a pas de padding...va savoir pourquoi wink.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.