ExtJS layout question

Hey, I am trying to do something real simple but my real simple brain can not get it to work. Basically, I want a box on the screen with some static information and a 'more' indicator. When the user clicks more, I'll resize an inner box to the full size of the data and I want the outer box to then display a scrollbar so the user can scroll to see the extra data.

After many hours of trying, I'm still not getting the structures correct. What I have so far is:

var info_block = new Ext.form.FieldSet( {
            layout: 'absolute',
            height: 254,
            width: 406,
            items:  [{x: 10,   y: 10: 'label',text: 'Status:'},
                     {x: 100,  y: 10, id: 'status_name', name: 'status_name', width: 300,value: 'New'},开发者_Python百科
                     {x: 10,    y: 50, xtype: 'label', text: 'Created By:'},
                     {x: 100,   y: 50,id: 'created_by',name: 'created_by',value: ''},
                     :
            ]
        });

    var scrolling_info_block = new Ext.form.FieldSet( {
            height: 154,
            width: 406,
            layout: 'absolute',
            autoscroll: true,
            title: 'outer',
            items:  [info_block]});

I then inset scrolling_info_block into my Panel. If I set the outerbox to have a layout of 'fit', it sizes correctly but has no scrollbar. If I set it to 'absolute', it grows to the size of the inner box.