Tree: node texts overlapping

[efege]

You may have noticed that in Ext Documentation Center,

http://extjs.com/deploy/ext/docs/index.html

when the west panel gets too narrow, the longer texts (of tree nodes) wrap. Using Firefox 1.5 on Windows, I see node texts overlapping, as shown in the first attached image. IE 6 does not show the problem (see second image).

To find a solution, I edited the file docs/resources/collapser.css, and replaced the rule


.pkg h3 { height:18px; }

by this one


.pkg h3 { margin: 0 0 4px; }

Works OK in Firefox 1.5/Win and IE 6. Not tested in other browsers.

To solve this problem in general, a similar modification would be needed to file resources/css/tree.css.

[efege]

I forgot to mention another situation in which this ugly text overlapping happens, and it's when you increase text size in Firefox.

I don't know how much interest people have in making Ext's widgets stable with respect to text resizing (or bulletproof, in Dan Cederhom's sense (http://www.simplebits.com/publications/bulletproof/)). Maybe working only with IE tends to make one forget about the importance of text resizing. But text resizing is a really useful aspect of the Web experience, Ext widget's quality is now another pleasing aspect of the Web, and somehow both aspects should live in harmony :)

[efege]

Just wondering... has this text overlapping issue been addressed?

[jack.slocum]

In the examples? No. When the revamped doc center launches (Ext 2.0) it will be long gone and forgotten. :)