Node height and XHTML

[ovidiuisac]

Hi.
I use DTD XHTML in my projects. But when use DTD XHTML, li (item node) has a height of 31px (replace default 18px height).
Correct this: remove display: inline-block; for span.fancytree-node (ui.fancytree.css).
Amazing plugin. Thanks.

[mar10]

That would be an easy change.
Have you checked compatibility on non-xhtml and different browsers?

[ovidiuisac]

Yes. This bug occurs only for Firefox and Chrome. Rewrite css with: display: inherited; or display: inline; or simple remove.
Check with Firefox, Chrome and IE 9 (and 7 & 8 compatibility) with XHTML and non-XHTML. Works.
Also use a custom jquery-ui library (minified) with 47 kb size (replace default library with 368kb size).
Includes: jquery.ui.core.js, jquery.ui.widget.js, jquery.ui.mouse.js, jquery.ui.draggable.js, jquery.ui.resizable.js
Again: amazing plugin. Thanks.

[mar10]

Original:

span.fancytree-node {
    display: inline-block;
}

This fixed it, but breaks indentation of ext-table nodes:

span.fancytree-node {
    display: inherit;
}

so the solution was to remove it altogether.

[mar10]

arghh... seems that now the skin-win8 is broken:
the select bar no longer has width 100%

[mar10]

This seems to work:

1. no whitespace between lines in XHTML docstyles
2. 100% wide selection bar in skin-win8
3. proper indentation for table tree

span.fancytree-node {
    display: inherit; /* resolves to 'display: list-item;' for standard trees */
    width: 100%;
}
table.fancytree-container span.fancytree-node {
    display: inline-block; /* 'inherit' would result in table-cell, which doesn't indent */
}