[Wikitech-l] OOUI: putting an IndexLayout inside a StackLayout

Hi,

I am trying to make a continuous StackLayout with three parts (top, middle and bottom), where the top panel contains an IndexLayout. My code is at https://meta.wikimedia.org/wiki/User:Huji/OOUI.js and as you can see, in the output of it the bottom and middle panels are shown "on top of" the top panel. This only occurs when the top panel is an IndexLayout; if I replace its contents with any other element, no overlap occurs.

Can you please guide me as to who to achieve what I want?

Thanks!

Huji

PS: The context here is that eventually each tab in the IndexLayout will present the user with some buttons; when they select a button from one of the tabs, the middle and bottom panels will be used to preview the output of that button and then save it to the page.