Child items of container with Border layout not resizing

I have a container that I need to render to a div, and I want to use the 'Border' layout. It renders fine initially, but resizing the browser window does not resize the child items in the container. Is it possible?

Code:

       Ext.create('Ext.container.Container', {
            width: '100%',
            height: 300,
            title: 'Border Layout',
            layout: 'border',
            items: [{
                title: 'South Region is resizable',
                region: 'south',     // position for region
                xtype: 'panel',
                height: 100,
                split: true,         // enable resizing
                margins: '0 5 5 5'
            },{
                // xtype: 'panel' implied by default
                title: 'West Region is collapsible',
                region:'west',
                xtype: 'panel',
                margins: '5 0 0 5',
                width: 200,
                collapsible: true,   // make collapsible
                id: 'west-region-container',
                layout: 'fit'
            },{
                title: 'Center Region',
                region: 'center',     // center region is required, no width/height specified
                xtype: 'panel',
                layout: 'fit',
                margins: '5 5 0 0'
            }],
            renderTo: 'container'
        });