I have created a window using code
var mainWindow = new Ext.Window({ title: 'Main Window', width: 700, height: 700, id: 'main-window', modal: true, draggable: false, resizable: false, autoScroll: true, items: [viewPage], layout: 'absolute' )};
Above window only shows vertical scrollbar.
In this window I have opened another modal window as following

var childWindow = new Ext.Window({
    title: 'Child',
    id: 'child-window',
    height: 130,
    width: 150,
    resizable: false,
    constrain: true,
    modal: true,    
    draggable: false,
    stateful: false,
    cls: 'main-window',
    header: false,
    frame: false,
    shadow: false,
    border: true,
    closable: true,
    renderTo: mainWindow.body,
    items: [{
        xtype: 'textarea',
Now when I open child window the mask width is larger and is less than the parent window so Hz scrollbar appears in parent window and bottom portion is not masked.

Is there any solution for this problem?
Thanks in advance.