应该是Ext的bug，当给grid的宽度设为100%时，其宽度会变成10000px，高度设置为100%，其内容自适应，而不是根据其容器自适应。
无奈只能通过其高度宽度设置为固定值（很管用的）
这样不论页面宽度怎么变化grid都会自适应页面容器了。

js代码如下：
   // create the Grid
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
            {id:'company',header: "Company", sortable: true, dataIndex: 'company'},
            {header: "Price", sortable: true, renderer: 'usMoney', dataIndex: 'price'},
            {header: "Change", sortable: true, renderer: change, dataIndex: 'change'},
            {header: "% Change", sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
            {header: "Last Updated", sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
        ],
        stripeRows: true,
        autoExpandColumn: 'company',
        frame:true,
        plugins: new Ext.ux.PanelResizer({
            minHeight: 100
        }),

        bbar: new Ext.PagingToolbar({
            pageSize: 10,
            store: store,
            displayInfo: true,
            plugins: new Ext.ux.ProgressBarPager()
        })
    });

    grid.render('grid-example');
    grid.setWidth(document.body.clientWidth-10);
    grid.setHeight(document.body.clientHeight-50);

    store.load({params:{start:0, limit:10}});
    //当窗口固定时触发的事件
    window.οnresize=function(){
        grid.setWidth(document.body.clientWidth-10);
        grid.setHeight(document.body.clientHeight-50);
    };
});