Balise <li> et Internet explorer

Auteur
singaii	# 10 Mar 2010 - 12:08:59
9 Posts	Bonjour, Désolé de ne venir ici que pour exposer mes soucis, des que j'aurais acquis un peu plus d'expérience promis je me lance à répondre. Je ne viens pas totalement les main vide non plus. J'expérimente un problème avec un menu constitué de 3 colonnes et dans la colonne centrale, de 10 lignes. il s'agit d'un habillage constituée d'images empilées. Ne souhaitant plus utiliser de <table> j'ai tenté de faire cela en css. mon architecture est la suivante : <div id="menu"> <img>une image supérieure</img> <img class="horizontal">longue bande verticale de gauche</img> <ul class="horizontal"> <li class="vertical">element 1</li> <li class="vertical">element 2</li> . . . <li class="vertical">element 10</li> <ul> <img class="horizontal">longue bande verticale de droite</img> </div> pour le css #menu { display: block; float: left; width: 175px; height: 100%; } .horizontal { display: inline; line-height:0; float: left; } .vertical { display: block; } mon premier souci était sous firefox, j'obtenais un décalage dans les <li> un décalage de toute les images comme si il y avait un border-bottom de 5 pixel line-height:0; a résolu ce problème Maintenant c'est sous IE que j'ai le bordel, toutes mes images ont comme une bordure qui me décale tout l'agencement. Je traine et je fouille partout pour voir ce qui pourrait me convenir mais je n'y arrive pas. Si une bonne âme pouvait aiguillée ? merci Modifié par singaii (10 Mar 2010 - 12:09)
9 Posts
Mikachu	# 10 Mar 2010 - 12:26:07
C'est quand les vacances ? Modérateur 5136 Posts	Salut, Tu peux facilement corriger cette différence dans internet explorer à l'aide des Qu’est-ce que les commentaires conditionnels. Une page en ligne ou au moins l'intégralité du code html et css ça aide à vous aider plus vite !
C'est quand les vacances ? Modérateur 5136 Posts
singaii	# 10 Mar 2010 - 12:35:11
9 Posts	merci pour ta réponse rapide. en passant mon post c'est retrouver dédoublé ... suite à un édit. mauvaise manip de ma part ? @ Nico3333fr en fait je n'ai pas dévoilé toute la structure. ce que je présente la est en fait mon menu de gauche il est composé d'une multitude d'image. ce n'est pas la structure globale de mon site juste un menu habillé si je comprend bien je devrais faire un float left et un float right pour les deux coté de mon menu et agencé en block les images du centre qui s'empilent. je retiens et je vais tester cette solution. mais comme mon agencement tiens sous pour le moment mon souci viens d'un problème purement IE @Mikachu je sais comment faire un code CSS spécifique IE mais je ne sais pas quoi mètre pour régler ce problème d'espace entre chaque images. en passant, il existe un autre hack que celui écrit dans ses pages : * html h1 { float: left; } seul IE execute ce code css je vais essayer de mettre en ligne le truc pour que l'on comprenne bien. Modifié par singaii (10 Mar 2010 - 12:41)
9 Posts
Heyoan	# 10 Mar 2010 - 12:47:09
Modérateur 8101 Posts	Salut, singaii a écrit : je vais essayer de mettre en ligne le truc pour que l'on comprenne bien. Yep ! Mais on peut déjà dire que ton code est plus qu'étrange : * les éléments IMG semblent être décoratifs et devraient donc logiquement être en background css. * un display:inline accompagné d'un float:left n'a aucun effet (si ce n'est de corriger un éventuel bug dans IE6 (et IE7 ?) * un display:block sur les LI est également inutile. * à quoi peut bien servir le line-height:0 ? * la classe verticale est inutile puisqu'il suffit de cibler avec ul.horizontal li { ... } Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
singaii	# 11 Mar 2010 - 10:05:07
9 Posts	un lien de test attention aux couleurs flashy. j'ai pour habitude de mettre des 'F0F', 'F00' et autre un peu partout pour bien voir mes divs. le découpage de la zone de menu n'est peut être pas des mieux adapté. pour ce qui est du code, je ne connais pas encore toute les subtilités ni tout les standard mais je souhaite m'amélioré. merci encore de passer du temps pour me corriger
9 Posts