Right now I have code structured something like this to do the family tree on the homepage. Using our real family data to make it clear who goes where:
UL
LI
UL
LI Dad
LI Mum
/UL
Paul (me)
OL
LI Thing one
LI Thing two
/OL
/LI
/ULso that neatly shows that Mum and Dad are my parents, and the boys are my children. It's scalable, I can neatly add in more children for the children and more parents for the parents and so on, but it doesn't allow for Clare, or for Kerry, they should fit in there too. So I need a rethink. I wonder if it can be more like: who goes where:
UL
LI
UL.parents
LI Dad
LI Mum
/UL
OL
LI
Paul (me)
DIV.spouse Clare
OL
LI Thing one
LI Thing two
/OL
/LI
LI
Kerry
OL
LI George
LI [Jack](/wiki/#jack)
/OL
/LI
/OL
/LI
/ULIf I can style that nicely, then it could be a goer...
Just thinking out loud here really, this means nothing to you...
The problem with a family tree is it's very hard to show all of parents, children, siblings, and spouse at the same time on a two dimensional chart. If you can do it with html I think you have to differentiate between traversing up the tree, and traversing down the tree... a chart of descendents is a bit different to a chart of ancestors. Think I can do it though. I'm using UL (unordered list html element) to mean "parents" and OL (ordered list element) to mean children... sort of works, not too weird I don't think.
Clare said "can't you just look up how other people have done it and just copy the best one?". I should do more investigation, but I think that this could be the best one... we'll see.
My styling so far is at [url]/css/_tree.css[/url]. I started from this css3 chart1 but soon hit its limitations.
💬 I've implemented that now, it's on the homepage
Paul Clarke's blog - I live in A small town. Wed + father to two, I am a full-stack web engineer, + I do mostly js / Node, some ruby, python, php ect ect. I like pubbing, running, eating, home automation + other diy jiggery-pokery, history, genealogy, Television, squirrels, pirates, lego, + TIME TRAVEL.