Li Bullet und Text auf gleiche Höhe bringen

[Gunnar Bittersmann]

@@hotti:

nuqneH

siehe Link. Der Text müsste ein kleines Stückchen höher, mit vertical-align bin ich jedoch nicht weiter gekommen. Wie gehts zu machen?

Verwende nicht list-style-image, sondern good ol’ background-image. Dazu padding-left: $Bildbreite + $Abstand und line-height: $Bildhöhe und list-style: none (letzteres gleich für das Listenelement, welches gerne ol sein darf, da die Listitems in einer bestimmten (zeitlichen) Reihenfolge sind.

Warum verwendest du so hässliche verpixelte Grafiken? Erstelle vernünftige, SVG bietet sich an. Du kannst auch aus dem Unicode-Vorrat schöpfen:
○   25CB  WHITE CIRCLE
●   25CF  BLACK CIRCLE
◐   25D0  CIRCLE WITH LEFT HALF BLACK
◑   25D1  CIRCLE WITH RIGHT HALF BLACK
☽   263D  FIRST QUARTER MOON
☾   263E  LAST QUARTER MOON
🌑   1F311  NEW MOON SYMBOL
🌓   1F313  FIRST QUARTER MOON SYMBOL
🌕   1F315  FULL MOON SYMBOL
🌗   1F317  LAST QUARTER MOON SYMBOL

Unter „zunehmendem Mond“ verstehe ich die gesamte Zeitspanne zwischen Neumond und Vollmond; unter „abnehmendem Mond“ die zwischen Vollmond und Neumond. Die korrekten Bezeichnungen für Halbmond wären „erstes Viertel“ und „letztes Viertel“.

Qapla'