Aufzählungszeichen bei mehrzeiligen <li></li>
LiAn
- css
Hallo allerseits,
hab ein kleines Problem:
Auf einer Seite habe ich eine <ul> mit einigen <li>s, davon sind ein paar mehrzeilig.
nun stellt es mir aber das Aufzählungszeichen im IE nicht bei der obersten Zeile des Eintrags dar, sondern links neben der untersten Zeile im FF siehts gut aus. Hab mit conditional comments ein eigenes IE.css gemacht.
mein Code im ie.css:
ul.liste {
color:#484549;
font-size:1.2em;
margin:15px 0 0 0;
line-height:1.4em;
list-style:square;
padding:0 0 0 15px;
}
ul.liste li {
line-height:1.4em;
}
Mein HTML:
<ul class="liste">
<li>Fleisch von der Buuremetzg, Gstaad</li>
<li>Gemüse, Salate und Früchte vom Lebensmittel-Detaillisten Schmid, Saanen</li>
<li>Brot und Backwaren von der Bäckerei Dubi und vom Early Beck aus Gstaad und Saanen</li>
<li>Käse, Joghurt, Glacen von den Molkereien Gstaad und Saanen</li>
<li>Frische Fische von Pernet Comestibles, Gstaad</li>
</ul>
würde mich über jede Hilfe freuen.
Danke!
Ave LiAn!
würde mich über jede Hilfe freuen.
Am einfachsten wäre es wohl, das Listen Bullet als background-image, und das dann mittels background-position immer top left oben festnageln.
Grüße aus H im R an LiAn,
Primus Enginus*
Am einfachsten wäre es wohl, das Listen Bullet als background-image, und das dann mittels background-position immer top left oben festnageln.
Vielen Dank für deine Hilfe, hat funktioniert.
Dachte mir schon, dass man es mit einem Background-Image machen muss. Hoffte aber, dass es auch noch eine andere Möglichkeit gibt, das list-style-Element zu positionieren.
Hoffte aber, dass es auch noch eine andere Möglichkeit gibt, das list-style-Element zu positionieren.
mit list-style-position geht das zb - aber auch mehr schlecht als recht :)
die background-variante bietet dir zudem ein flexibles aufzählungszeichen und bessere kontrolle
btw: vergiss aber list-style: none: nicht
btw: vergiss aber list-style: none: nicht
Hab ich nicht vergessen. Danke.
Das CSS sieht nun so aus (falls das noch jemanden interessiert):
ul.liste {
color:#484549;
font-size:1.2em;
margin:15px 0 0 0;
line-height:1.4em;
padding:0;
}
ul.liste li {
line-height:1.4em;
background:url(../../images/listenbullet.gif) top left no-repeat;
list-style:none;
padding-left:15px;
}
Das CSS sieht nun so aus (falls das noch jemanden interessiert):
warum du deinem ul die klasse "liste" gibst, leuchtet mir aber noch nicht ganz ein ;)
wenns eine normale standard-inhalts-liste ist, dann sollte sie keine klasse brauchen, da sie dann ja den standard darstellt
wenns eine normale standard-inhalts-liste ist, dann sollte sie keine klasse brauchen, da sie dann ja den standard darstellt
ist wahr. hab halt noch ein paar andere listen. die dann wieder andere klassen haben. aber eigentlich hätte ich die normale liste nicht klassifizieren müssen. tja, jetzt ist's zu spät hab schon an zuvielen orten: class=liste" reingeschrieben.
danke, trotzdem.