panel with border layout only shows title bar

[ryanrca]

Hi guys, I'm really hitting my head on the wall for this one.

Eventually I want a two section border layout, with a form in "west" and a grid in "center". That wasnt working, so I simplified things a lot:

    filter_panel = {
        title: 'filters',
        region: 'west',
        width: 150, 
        html: "<h2> FILTERS! </h2>",
    }

    center_panel={
        title: 'Center Panel', 
        region: 'center', 
        html: "<h2> GRID! </h2>",
    //    items: userGrid,
    }

    panel = new Ext.Panel({
        renderTo: 'user-grid',
        frame: false,
        title: "Publish Runs",
        layout: 'border',
        collapsible: true,
        autoWidth: true, 
        // autoHeight: true, 
        height: 800,     
        defaults: {
            collapsible: true,
            split: true,
        },
        items: [filter_panel, center_panel ]
    });

But, no matter what I do, collapsable or not, the panel is empty. It just shows the title bar. I don't have a clue what is wrong.

Thanks!

[laurentParis]

filter_panel = {
    title: 'filters',
    region: 'west',
    width: 150, 
    html: "<h2> FILTERS! </h2>"
}

center_panel={
    title: 'Center Panel', 
    region: 'center', 
    html: "<h2> GRID! </h2>"
}

panel = new Ext.Panel({
    renderTo: document.body,
    frame: false,
    title: "Publish Runs",
    layout: 'border',
    collapsible: true,
    autoWidth: true, 
    // autoHeight: true, 
    height: 800,     
    defaults: {
        collapsible: true,
      split: true
    },
    items: [filter_panel, center_panel ]
});