ExtJs 4网格面板在窗口调整大小时没有正确调整大小

我在div中渲染网格面板，对于div和网格面板，我没有指定任何宽度，因此它应该占用浏览器的所有可用宽度。当用户重新调整浏览器窗口的大小时，此网格不会根据浏览器的新宽度重新调整大小。我已经尝试了在下面的链接中找到的建议/解决方案，但这些对我不起作用

堆栈溢出帖子-从这个我尝试了窗口重新调整大小的解决方案

ExtJs插件-适合家长-我也将这个ExtJs 3插件移植到ExtJs 4，但这也没有帮助

非常感谢任何指示或帮助

以下是我的项目中Grip面板的代码片段

    Ext4.define('myNameSpace.myGrid', {
    extend: 'Ext4.grid.Panel',
    alias: ['widget.myGrid'],
    constructor: function (config) {
        config = Ext4.apply({}, config || {}, {
            columnLines: true,
            sortableColumns: false,
            enableColumnHide: false,
            enableColumnMove: false,
            enableColumnResize: false,
            forceFit: false,
            viewConfig: {
                enableTextSelection: true,
                stripeRows: false,
                loadMask: false,
                emptyText: '<div class="x-grid-empty"> NO Data present</div>',
                deferEmptyText: true,
                getRowClass: function(record, rowIndex, rowParams, store){
                    return record.data.isExpired ? "expired-transaction" : '';
                }
            },
            columns: {
                defaults: { 
                    height: 30  
                },
                items: [
                    {
                        text: "&#160;",
                        id: "recurringColumnHdr",
                        width: 30,
                        dataIndex: "isRecurring",
                        align: "center"
                    },
                    {
                        text: "From",
                        id: "fromColumnHdr",
                        width: 175,
                        flex: .15,
                        dataIndex: "fromAccountDescription"
                    },
                    {
                        text: "To",
                        id: "toColumnHdr",
                        width: 175,
                        flex: .15,
                        dataIndex: "toAccountDescription"
                    },
                    {
                        text: "Amount",
                        id: "amountColumnHdr",
                        width: 100,
                        dataIndex: "amount",
                        renderer: Ext4.util.Format.usMoney,
                        align: 'right'
                    },
                    {
                        text: "Date",
                        id: "dateColumnHdr",
                        width: 75,
                        dataIndex: "transferDate",
                        align: 'right'
                    },
                    {
                        text: "Repeat",
                        id: "repeatColumnHdr",
                        dataIndex: "frequency",
                        flex:.35,
                    },
                    {
                        text: "Memo",
                        dataIndex: "memo",
                        id: "memoColumnHdr",
                        flex: .35
                    }
                ]
            },
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'bottom',
                height: 30
            }]
        });
        this.callParent([config]);

    }
});

这是我用来在网格上渲染的代码

 Ext4.create('myNameSpace.myGrid', {
            store: Ext4.create('myGridStore'),
            renderTo: 'transfersGrid',
            id: "transferGridPanel"
        });