Der Martin: Zeilenabstand entfernen

Beitrag lesen

Hallo,

setze line-height auf denselben Wert wie font-size, dann kleben die Zeilen ohne Abstand aneinander.
Schön oder gar praktisch ist das aber nicht.
Das klappt nicht:

davon bin ich noch nicht überzeugt, aber dein Beispiel ist mir zu "wüst", um es auszuprobieren.
Ich frage mich nämlich etwas ganz anderes:

Ergebnis

Das soll eine hierarchisch organisierte Baumstruktur darstellen, schön. Also eine Liste gleichartiger Einträge; eventuell auch eine mehrfach verschachtelte Liste. Aber ich käme nicht auf die Idee, das durch so einer div-Wüste mit Klassengesellschaft darzustellen.

<div class="dirtree">
<div class="node"><div class="join"></div><div class="desc">Knoten 1</div></div>
<div class="node"><div class="join"></div><div class="desc">Knoten 1</div></div>
<!-- die gleiche Zeile evtl. noch öfters -->
</div>

Ich sehe das eher so:

<ul class="dirtree">  
 <li>Knoten 1</li>  
 <li>Knoten 2</li>  
 [...]  
</ul>

Den üblichen Aufzählungspunkt (Bullet) nehmen wir mit list-style-type:none weg, die Verbindungslinie kommt als links ausgerichtetes und nicht wiederholtes Hintergrundbild in die li-Elemente; das letzte seiner Art bekommt ein abweichendes Bild (eines, das keine Linienfortsetzung nach unten mehr hat). Wenn man dann noch die Höhe der li-Elemente an das Bild anpasst, stimmt die Chose schon beinahe. Das kann man dann sogar verschachteln, und die Darstellung passt immer noch.
Das je nach Browser unterschiedliche Handling der Listeneinrückung muss man eventuell normalisieren, indem man padding-left und margin-left sowohl des ul- als auch der li-Elemente explizit setzt.

So long,
 Martin

--
Lebensmotto der Egoisten:
Was ist so schlimm daran, dass jeder nur an sich selbst denkt? Dann ist doch an alle gedacht!
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(