nicht angemeldet
Wozu, was willst du erreichen?
Es soll mit Hilfe von verschiedenen Grafiken ein Baum dargestellt werden, der ungefähr so aussieht:
Ja - beschreibe dein Problem so, dass wir es nachvollziehen können.
Valides (vorzugweise Online-) Beispiel, genaue Beschreibung von gewünschtem Ergebnis.
Beispielcode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
.dirtree .node {
line-height: 0;
}
.dirtree .node div:not(.node):not(.children) {
display: inline-block;
}
.dirtree .node .join {
background-image: url(./img/join.gif); /* Bild in der Größe von 18x18 */
height: 18px;
width: 18px;
}
.dirtree .node .desc {
background-color: #c0d2ec;
}
</style>
</head>
<body>
<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>
</body>
</html>
Das line-height: 0; ist dazu da, dass die Grafiken join.gif (
) nahtlos übereinander stehen, was zu einem guten Effekt führt, allerdings wird die Hintergrundfarbe nicht angezeigt. Ohne diese Angabe wird die Hintergrundfarbe zwar angezeigt, dafür gibt es einen Abstand zwischen den beiden Grafiken, der nicht gewollt ist.
Problem klar? :)
Der Martin
Gunnar Bittersmann
MudGuard