How to stop overlapping ExtJS TreeList items?

0
votes

I'm using border layout panel with TreeList component and panels on the center, but when I add panel to center card panel, TreeList items are overlapped by panel headers.

How to fix it?

enter image description here

Steps to reproduce: click Home menu item

ExtJS 6.0.0.640, Triton theme

Demo is here: https://fiddle.sencha.com/#view/editor&fiddle/2cs7

1
javascriptextjs

1 Answers

1
votes

Set the z-index of the center region to a value less than the menu's. In your fiddle example, this worked with value zero.

// JavaScript
{
    xtype: 'panel',
    region: 'center',
    cls: 'panel-center'
}

// CSS
.panel-center {
    z-index: 0;
}