Aufzählungsliste: Textabstand in Tabelle
Roberto Cozzetto
- css
Hallo zusammen
Ich habe eine simple Tabelle mit einer Aufzählungsliste drin:
<table border="1" width="100%">
<tr>
<td width="50%">
<ul>
<li>test</li>
<li>test</li>
<li>test<br>
test</li>
<li>test</li>
<li>test<br>
test</li>
<li>test</li>
</ul>
</td>
<td width="50%"> </td>
</tr>
</table>
Damit nun die Aufzählungszeichen ganz links ausgerichtet werden, und auch die unterste Leerzeile zwischen letztem Aufzählungspunkt und Tabellenrand verschwindet, hab ich u.a. den text-indent auf 15px gestellt und den margin auf 0px:
ul { font-family: Verdana;
font-size: 11px;
list-style:square;
list-style-position: inside;
list-style-type: square;
text-indent: 15px;
margin: 0px;
}
Problem dabei: bei Zeilenumbrüchen wird der Text in der umgebrochenen zweiten Zeile auch ganz links am Tabellenrand ausgerückt (statt schön linear unter der ersten Zeile).
Wenn ich zB den text-indent auf 0px stelle und dafür den margin-left auf 15 pixel, dann hab ich zwar die Umbrüche linear dargestellt; leider erscheint dann wieder die unterste Leerzeile als Platzhalter zwischen dem letzten Aufzählungspunkt und dem Tabellenrand.
Wer kann mir hier weiterhelfen? Übrigens, es muss für den IE umgesetzt werden, da es für ein Intranet eines Geschäfts mit IE ist.
Danke für die Tipps.
Hallo,
Damit nun die Aufzählungszeichen ganz links ausgerichtet werden, und auch die unterste Leerzeile zwischen letztem Aufzählungspunkt und Tabellenrand verschwindet, hab ich u.a. den text-indent auf 15px gestellt und den margin auf 0px:
Was genau bezweckst Du mit dem text-indent hier zu erreichen?
ul { font-family: Verdana;
font-size: 11px;
list-style:square;
^Warum das und später nochmal list-style-type: square;? Lass das weg.
list-style-position: inside;
^Was soll das bringen? Lass es weg.
list-style-type: square;
text-indent: 15px;
^Lass das weg.
margin: 0px;
padding: 0;
padding-left: 15px;
}
Nutze padding-left für das UL-Element, um den Platz für die Aufzählungszeichen vorzugeben und ggf. padding-left für die LI-Elemente, um den Abstand zwischen Aufzählungszeichen und Text zu vergrößern.
Problem dabei: bei Zeilenumbrüchen wird der Text in der umgebrochenen zweiten Zeile auch ganz links am Tabellenrand ausgerückt (statt schön linear unter der ersten Zeile).
Ja, wegen list-style-position: inside.
viele Grüße
Axel