Liste ul

[ecocentric]

Je voudrais simplement avoir une liste ul li /li /ul dont les puces soient alignées à gauche de mon document SANS retrait AVANT la puce. Il y a un retrait par défaut que je n'arrive jamais à enlever. QQn sait-il comment faire ?
Merci !

 

[ideezik]

En css non ?

Tu vires le margin et le padding.

ul { 
margin-left:0;
padding-left:0;
}

A voir s'il faut pas aussi jouer sur le li je l'ai fait mais je sais plus

 

[ecocentric]

En css non ?

Tu vires le margin et le padding.

ul { 
margin-left:0;
padding-left:0;
}

A voir s'il faut pas aussi jouer sur le li je l'ai fait mais je sais plus

En css, oui, c'est ce que je veux.

Cependant, ta solution vire les puces. Or, je veux les puces ;-).

 

[ideezik]

Non mais solution ne vire pas les puces je pense. Elle les cache :wink:

Pour virer les puces c'est :

list-style-type: none;

Essaie sans marge mais en laissant le padding pour voir. Si c'est pas ca je vais sortir l'éditeur et regarder. Moi j'utilise quasiment jamais les puces de base donc j'ai pas le pb

 

[ecocentric]

Non mais solution ne vire pas les puces je pense. Elle les cache :wink:

Pour virer les puces c'est :

list-style-type: none;

Essaie sans marge mais en laissant le padding pour voir. Si c'est pas ca je vais sortir l'éditeur et regarder. Moi j'utilise quasiment jamais les puces de base donc j'ai pas le pb

Merci pour la précision .
Sans margin, ça donne la même chose :-(

 

[ideezik]

ul { margin:0; padding:6px; }

Essaie ca. Ca marche chez moi. Tu changes le padding en fonction de ce que tu veux.

 

[ecocentric]

Si c'est pas ca je vais sortir l'éditeur et regarder. Moi j'utilise quasiment jamais les puces de base donc j'ai pas le pb

Je viens de jeter un oeuil rapide dans NVU : tu mets des puces et il met un retrait avant les puces. Si tu délales la liste vers la gauche, il vire automatiquement les puces.

Donc, je cherche toujours.

NB : il y a moyen, j'avais trouvé il y a quelques mois, mais je ne retombe plus sur la solution.

 

[ideezik]

Bah t'as vu ce que j'ai mis juste au dessus ?

:?:

 

[ecocentric]

ul { margin:0; padding:6px; }

Essaie ca. Ca marche chez moi. Tu changes le padding en fonction de ce que tu veux.

En effet, merci !

Par contre, cette solution pose un problème : si tu mets du texte au dessus de ta liste (< p> texte < /p>), le texte au dessus n'est plus aligné avec la puce. La puce est collée au bord de ta page, le texte simple au dessus est légèrement décalé sur la droite.

 

[ideezik]

Deux solutions.

Soit tu augmentes le padding-left de la puce pour aligner avec le texte.

Soit tu diminues le padding-left du texte pour aligner avec la puce.

En fonction de ce que tu veux....

 

[ecocentric]

Deux solutions.

Soit tu augmentes le padding-left de la puce pour aligner avec le texte.

Soit tu diminues le padding-left du texte pour aligner avec la puce.

En fonction de ce que tu veux....

Oui, oui, bien sûr.
Ce que je me demande, c'est s'il n'existe pas une solution qui les laissent alignés (je me demande s'il ne faut pas jouer aussi sur les li, dans ce cas), sans devoir chipotter sur les nombres de pixels. Mais c'est clair, qu'à défaut, c'est comme cela que je ferai. Encore merci pour ta solution, d'ailleurs !

 

[Kmacleod]

Et verifier que IE et Firefox donnent le même resultat coté alignement

 

[ecocentric]

Et verifier que IE et Firefox donnent le même resultat coté alignement

Vérifié, c'est bon de ce côté. Ouf ;-) !

 

[milkiway]

ul{
list-style-position:inside;
}
là on contrôle mieux le truc

 

[ecocentric]

ul{
list-style-position:inside;
}
là on contrôle mieux le truc

Aaah !
C'est tout beau, tout propre. C'est exactement ce que je cherchais.

Merci (à tous), ça marche nickel .

Au fait, je viens de trouver ça : http://gilles.chagnon.free.fr/cours/html/css1.html . Ca a l'air intéressant, sur le CSS.

 

[ecocentric]

En fait, le list-style-position:inside; a un effet non souhaité : la passage à la ligne se fait à hauteur de la puce. Donc, retour à la première solution ;-)

 

[milkiway]

Oui normal puisqu'il impose que la puce soir insérée DANS le texte