I'm trying to build a genealogy tree with HTML tables (and nested tables). It should, ultimately be editable by the user using contenteditable, and the nested cells should resize accordingly.
However, to my mystery, when I edit the cells, they resize far too fast and too much. Why so?
The outer table keeps everything under control, so sizes are fixed using
table-layout:fixed;
The nested table cells, on the other hand are only specified via
margin:auto;
Every cell's width is set individually via percentage, and it looks perfect before editing. Not so after.
DEMO here http://jsfiddle.net/KtB6C/ Try editing the Father or Mother cell.
I know this is a "fix-my-code" problem, but any help is appreciated.
