What's wrong with this nested accordion headers within ELeague 2 here?

[seaders]

https://jsfiddle.net/byxwtkf7/3/

The ones in ELeague are sized properly because (I think) it was visible when the page was rendered, but when you open ELeague 2, the headers are way too big, 200px~.  If you close and re-open it however, it does a small refresh and then corrects its size.

I do have a class in my setup, "delayed-accordion" that causes a delay until the element is visible until converting it which I can use, but I was just wondering if there's something I'm doing wrong that's causing this (or if it's actually a bug with the system, generally).

[jarry]

Please add 'width:100%' style to the nested accordion component. This will force the child accordion to resize when it is opened. This is the updated example. It works fine.
https://jsfiddle.net/byxwtkf7/4/

[seaders]

Perfect!  Is that a general rule of thumb for all nested accordions and datagrids et al?  I'm asking that because I think this is one area I've tripped up on previously.