Décalage de li sous FF

Bonjour,
j' ai un petit problème:
j' ai des listes sous cette forme:

				<ul style="display:inline">
					<li>liufgh ifizeuzieufzifgz if</li>
					<li>ohfohf zehf ozehuf zufhzi ufe </li>
					<li>oihfzoiufhzeoifhziu </li>
				</ul>

J' ai utilisé le inline car je ne souhaite par qu' il y ait une ligne de sautée entre ces listes et la phrase qui les précède. Tout va bien sous IE et opera mais sous FF mes puces sont bloquées à gauche de la page et il y a un espace important entre ces puces et le texte des li
que ce passe t' il ?
Modifié par chrisllers (20 Aug 2008 - 22:34)

Bonjour chrisllers,

Il est possible que cet item de la FAQ puisse te venir en aide...

Je ne visualise cependant pas très bien ce que tu tentes de faire
Aurais-tu une page en ligne ou un code plus complet ?
Les informations de styles ne devraient pas se trouver dans ton code html

Cdt,
Sylvain

oui, je te mets un lien vers la page en question:
Cilque

Bonjour,

1. Ne pas passer un élément UL en display: inline, c'est une bêtise (sauf à passer également les LI en display: inline, à virer les puces avec un list-style: none, et autres modifications pour faire apparaitre la liste complète comme une partie d'un paragraphe, sans retour à la ligne).

2. Ne pas utiliser la propriété text-indent sur un conteneur (ici le DIV parent). Cette propriété est héritée, et s'appliquera également aux LI. Si on veut des paragraphes avec retrait, on appliquera text-indent directement aux paragraphes.

Florent V. a écrit :
1. Ne pas passer un élément UL en display: inline Si on veut des paragraphes avec retrait, on appliquera text-indent directement aux paragraphes.

Bonjour
c' est effectivement ce que j' avais fait au départ. Le code que tu as vu c' est celui que j' avais tenté de bidouiller pour éviter qu' une ligne ne soit sautée avant et après cette liste.
J' ai donc remis le code d' origine sur ma page et comme tu peux le voir, des lignes sont sautées. Est-ce que l' on peut éviter celà ?

chrisllers a écrit :
J' ai donc remis le code d' origine sur ma page

Hmm, pas vu de différence pour ma part, même en vidant le cache et rechargeant la page.

chrisllers a écrit :
et comme tu peux le voir, des lignes sont sautées

Même en supprimant le display: inline, il n'y a pas de lignes sautées. Il y a tout simplement des marges appliquées par défaut par le navigateur aux éléments UL.

Pour un correctif rapide, tu pourrais appliquer les styles suivants à ta liste:

margin: 0 0 0 20px;
text-indent: 0;

Mais tout ça n'est pas très propre. Il faudrait déjà revoir ton code HTML, et commencer à utiliser des paragraphes plutôt que de placer des flots de texte entier dans des éléments DIV, avec des BR pour faire des retours à la ligne. Si les marges des paragraphes t'embêtent, tu pourras toujours les supprimer (ce qui serait dommage, car ça facilite tout de même la lecture en donnant des points de repère dans le texte).

En passant, une recommandation sans rapport: ne pas souligner les textes qui ne sont pas des liens. Tu as du texte en blanc souligné en blanc, et il est impossible de savoir (sans passer la souris sur le texte) s'il s'agit:
- de liens;
- de titres;
- d'autre chose...
Gros problème ergonomique.

Autre remarque sans rapport: en typographie française (et anglaise, et d'autres encore sans doute), il n'y a pas d'espace après une apostrophe. On écrit donc «D'accord» et non pas «D' accord», par exemple.
Modifié par Florent V. (21 Aug 2008 - 22:51)

Florent V. a écrit :

Hmm, pas vu de différence pour ma part, même en vidant le cache et rechargeant la page.

oui pardon, je n' avais pas chargé la page dans le bon dossier, le lien est bon maintenant.

a écrit :
Il faudrait déjà revoir ton code HTML, et commencer à utiliser des paragraphes plutôt que de placer des flots de texte entier dans des éléments DIV, avec des BR pour faire des retours à la ligne.

à quelle partie du code fais-tu allusion ?

a écrit :
Pour un correctif rapide, tu pourrais appliquer les styles suivants à ta liste:

margin: 0 0 0 20px;
text-indent: 0;

Bonjour, j' ai essayé mais ça ne supprime pas la séparation entre mon paragraphe <p> et la liste ul
Modifié par chrisllers (22 Aug 2008 - 23:22)