Stammbaum - Linien erstellen mit CSS
Jonas
- css
Ich mache zurzeit einen Stammbaum, der mit PHP erstellt wird. Ich möchte nun mit Linien die einzelnen Personen verbinden. Wie kann ich das realisieren, dass die Linien genau in der Mitte der CSS-Boxen sind?
http://da-js.kilu.de/stammbaum.bmp
Hi
ich würde es, der Einfachheit halber, mit einer Tabelle lösen.
Bei Wikipedia gibt es den Artiekl über die WM 2006 Finalrunde in dem ein Baum genauso dargstellt wird.
so long
Ole
(8-)>
Hi
ich würde es, der Einfachheit halber, mit einer Tabelle lösen.
Bei Wikipedia gibt es den Artiekl über die WM 2006 Finalrunde in dem ein Baum genauso dargstellt wird.
so long
Ole
(8-)>
Ich habe mir den Quelltext angeschaut, aber mir ist nicht ganz klar wie die Linien letztendlich erstellt wurden. Das Problem ist ja auch, dass ich nicht zwei Spalten direkt übereinander habe.
Hi
Ich habe mir den Quelltext angeschaut, aber mir ist nicht ganz klar wie die Linien letztendlich erstellt wurden. Das Problem ist ja auch, dass ich nicht zwei Spalten direkt übereinander habe.
Das mit den Linien ist recht einfach gelößt. Es sind Rahmen von Tabellenzellen :)
Um mit diese Methode eine Linie bei einer ungrade Anzahl von Parteien mittig zu bekommen, muß der mittlere Eintrag einfach über zwei Zeilen gehen.
so long
Ole
(8-)>
Hi
Ich habe mir den Quelltext angeschaut, aber mir ist nicht ganz klar wie die Linien letztendlich erstellt wurden. Das Problem ist ja auch, dass ich nicht zwei Spalten direkt übereinander habe.
Das mit den Linien ist recht einfach gelößt. Es sind Rahmen von Tabellenzellen :)
Um mit diese Methode eine Linie bei einer ungrade Anzahl von Parteien mittig zu bekommen, muß der mittlere Eintrag einfach über zwei Zeilen gehen.
so long
Ole
(8-)>
Stimmt! Danke!
Hi
Ich habe mir den Quelltext angeschaut, aber mir ist nicht ganz klar wie die Linien letztendlich erstellt wurden. Das Problem ist ja auch, dass ich nicht zwei Spalten direkt übereinander habe.
Das mit den Linien ist recht einfach gelößt. Es sind Rahmen von Tabellenzellen :)
Um mit diese Methode eine Linie bei einer ungrade Anzahl von Parteien mittig zu bekommen, muß der mittlere Eintrag einfach über zwei Zeilen gehen.
so long
Ole
(8-)>
So ich habs jetzt hinbekommen:
<HTML>
<HEAD>
<TITLE>New Document</TITLE>
</HEAD>
<BODY>
<table border="1">
<tr><td></td><td></td><td> </td><td rowspan="2">Sohn 1</td></tr>
<tr><td></td><td></td><td> </td></tr>
<tr><td> </td><td> </td><td> </td><td> </td></tr>
<tr><td rowspan="2">Vater</td><td> </td><td> </td><td rowspan="2">Sohn 2</td></tr>
<tr><td> </td><td> </td><td></td></tr>
<tr><td> </td><td> </td><td> </td><td> </td></tr>
<tr><td></td><td></td><td> </td><td rowspan="2">Sohn 3</td></tr>
<tr><td></td><td></td><td> </td><td></td></tr>
</table>
</BODY>
</HTML>
Aber wie ziehe ich jetzt die Linien? in SELFHTML steht nur für <table> was, aber ich muss das doch ganz spezifisch angeben? Wie sag ich ihm jetzt, dass er in einer Zelle die Linie unten hat, in der andere an der Seite etc.?
Hi
Ich habe mir den Quelltext angeschaut, aber mir ist nicht ganz klar wie die Linien letztendlich erstellt wurden. Das Problem ist ja auch, dass ich nicht zwei Spalten direkt übereinander habe.
Das mit den Linien ist recht einfach gelößt. Es sind Rahmen von Tabellenzellen :)
Um mit diese Methode eine Linie bei einer ungrade Anzahl von Parteien mittig zu bekommen, muß der mittlere Eintrag einfach über zwei Zeilen gehen.
so long
Ole
(8-)>So ich habs jetzt hinbekommen:
<HTML>
<HEAD>
<TITLE>New Document</TITLE>
</HEAD>
<BODY><table border="1">
<tr><td></td><td></td><td> </td><td rowspan="2">Sohn 1</td></tr>
<tr><td></td><td></td><td> </td></tr>
<tr><td> </td><td> </td><td> </td><td> </td></tr>
<tr><td rowspan="2">Vater</td><td> </td><td> </td><td rowspan="2">Sohn 2</td></tr>
<tr><td> </td><td> </td><td></td></tr>
<tr><td> </td><td> </td><td> </td><td> </td></tr>
<tr><td></td><td></td><td> </td><td rowspan="2">Sohn 3</td></tr>
<tr><td></td><td></td><td> </td><td></td></tr>
</table></BODY>
</HTML>Aber wie ziehe ich jetzt die Linien? in SELFHTML steht nur für <table> was, aber ich muss das doch ganz spezifisch angeben? Wie sag ich ihm jetzt, dass er in einer Zelle die Linie unten hat, in der andere an der Seite etc.?
Ich hab nochmal gesucht und festgestellt, dass das per CSS geht. Aber wenn ich über border gehe, dann ist die linie trotzdem nicht ganz in der Mitte. Wie kann ich denn die Linie zwischen zwei Zellen erfassen?
hi
erstmal solltest du üben, anständig zu zitieren. immer das ganze posting drinstehen zu lassen macht die sache nicht übersichtlicher. :)
Ich hab nochmal gesucht und festgestellt, dass das per CSS geht. Aber wenn ich über border gehe, dann ist die linie trotzdem nicht ganz in der Mitte. Wie kann ich denn die Linie zwischen zwei Zellen erfassen?
Damit die Linie in der Mitte ist, muß die Zelle welche über 2 Zeilen geht so hoch sein, wie die Beiden Zellen und der Rahmen.
Dabei empfiehlt es sich die eine Hälfte der Breite des Rahmens auf die obere und die andere auf die untere Zelle zu verteilen. Dein Rahmen hätte somit ein Breite von min. 2px.
so long
Ole
(8-)>
Damit die Linie in der Mitte ist, muß die Zelle welche über 2 Zeilen geht so hoch sein, wie die Beiden Zellen und der Rahmen.
Das Problem ist, dass die Zellhöhe nicht immer gleich ist. Ich generiere das mit PHP, also ist der Wert immer anders.