Responsive design et puces

Par Genki, il y a 10 ans


Les bases HTML/CSS

Hello,

En train de developper mon blog en responsive design, je galère un peu au niveau des puces, ça fait bien en full-screen, mais en taille mobile, bah.. Voyez par vous même en faites :

Fullscreen

Mobile

Je sais pas comment adaptez les puces en css avec les media queries pour que ça rendent bien visuellement, si vous avez des idées ou des exemples, merci !

4 réponses

MrCastor, il y a 10 ans

Salut,

Quest-ce qui te gène ? Les lézardes dans le texte (espaces blancs créés automatiquement pour remplir la ligne) ?
Si c'est cela :

li { text-align: left; }
Benjamin Derepas, il y a 10 ans

Si tu parles des espaces entre les mots, c'est que tes puces doivent être en text-align:justfiyce qui veux dire que la navigateur va ajouter des espaces entre les mot pour que chaque ligne ai la même longueur .
Malheureusement ce problème persiste depuis longtemps on ne peut rien y faire , les propriétés permettants de fixer ce souçis sont encore en état de broullion).
La solution comme l'a dit @MarCastor est la seule viable à ce jour

Genki, il y a 10 ans

Ah non non c'est pas le justify, ça c'est voulu, le problème c'est le décalage de ouf, la présentation, je trouve ça moche des puces sur mobile. Du coup je sais pas trop comment présenter ça

Benjamin Derepas, il y a 10 ans

Tu peux arranger ça par exemple en changeant le décallage des ul/li et en diminuant la font size par exemple.

ul{ margin-left:5px; } ul li{ font-size:0.85em; line-height:1.2 }