Some of the more complex web applications will need to do things that are not as simple as setting a few configuration values, for example nesting one layout within another layout, or adding icons to your tabs. But with Ext JS these kinds of things are made easy.
When we nest one layout within another layouts region, we will occupy that entire region's body so it cannot be used any more. Instead, the nested layout regions are used for content.
For example, if we wanted the center region split into two horizontal regions, we could add a nested layout with center and North regions. This is typical of an application where you have a data panel (Center) to list email messages and a reader panel (South) to preview the entire email when it's selected in the list in the North panel.
A couple of things are needed for a nested layout—the layout type must be set, and in this case, we are turning off the border so we don't get a doubled...