Forum>Netzwerke>HTML/CSS Auflistung mit Tabstopp

HTML/CSS Auflistung mit Tabstopp

dom_beta17.05.1223:42

Hallo,

gibt es in HTML und/oder mit CSS die Möglichkeit, eine Auflistung zu erstellen mit Tabstopps?

Siehe Bild. Geht so was?
„...“
0

Kommentare

sierkb18.05.1201:58
Zum Beispiel als Definitionsliste <dl>:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
   <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
   <title>Test</title>
   <style type="text/css">
     dt {
     float: left;
     clear: left;
     width: 120px;
     margin-right: 2em;
     }
     dt::before {
     content: "\2022\00a0";
     }
   </style>
 </head>
 <body>
   <dl>
     <dt>12 Uhr</dt>
     <dd>Dies &amp; Das</dd>
     <dt>14 bis 16 Uhr</dt>
     <dd>Jenes</dd>
   </dl>
 </body>
</html>
0
dom_beta18.05.1202:48
Oh hallo Sierk!

Danke für deine Antwort.

Kurze Nachfrage meinerseits:

Was bedeutet dies?
dt::before {
content: "\2022\00a0";
}

Genau: Was bedeutet diese Zahlenkombination?
„...“
0
sierkb18.05.1210:06
Genau: Was bedeutet diese Zahlenkombination?

Unicode-Zeichen.
U+2022 BULLET • ,
U+00A0 NO-BREAK SPACE (NBSP/Geschütztes Leerzeichen) ,

Zu "content":

W3C CSS 2.1: 12 Generated content, automatic numbering, and lists , 12.2 The 'content' property

Sprich:

dt::before {
content: "\2022\00a0";
}

setzt mit ::before jedem dt ein Bullet (•) und ein geschütztes Leerzeichen (nbsp) vor die Nase.
0
dom_beta19.05.1223:59
Gibt es auch eine Möglichkeit, das zweizeilig zu gestalten?

Wenn also das <dd> zuviel Text enthält?
„...“
0

Kommentieren

Diese Diskussion ist bereits mehr als 3 Monate alt und kann daher nicht mehr kommentiert werden.