Схема потока с вложенным контейнером

В моем приложении Ext JS 6 я пытаюсь создать макет потока с 3 контейнерами, причем в среднем контейнере есть вложенные элементы, которые необходимо продолжить с макетом потока. Я могу заставить это работать, если я добавлю элементы среднего контейнера напрямую, но я не хочу этого делать... Я хочу, чтобы они были отдельными.

Вот пример:

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.panel.Panel', {
            height: 300,
            width: 300,
            scrollable: true,
            renderTo: Ext.getBody(),
            title: 'Not properly working',
            bodyPadding: 10,
            layout: {
                type: 'column'
            },
            items: [{
                xtype: 'panel',
                title: 'start',
                width: 100,
                height: 50
            }, {
                xtype: 'container',
                defaults: {
                    xtype: 'panel',
                    title: '1',
                    width: 50,
                    height: 50,
                    style: 'float: left;'
                },
                items: [{}, {}, {}, {}, {}, {}]
            }, {
                xtype: 'panel',
                title: 'end',
                width: 100,
                height: 50
            }]
        });
        Ext.create('Ext.panel.Panel', {
            height: 300,
            width: 300,
            scrollable: true,
            renderTo: Ext.getBody(),
            bodyPadding: 10,
            title: 'This is how it should look',
            layout: {
                type: 'column'
            },
            items: [{
                xtype: 'panel',
                title: 'start',
                width: 100,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: '1',
                width: 50,
                height: 50
            }, {
                xtype: 'panel',
                title: 'end',
                width: 100,
                height: 50
            }]
        });
    }
});

Итак, мой макет потока должен выглядеть так (изображен на второй панели примера):

start 1 1 1 (newline)
1 1 1 end

Я получил идею из этой темы, но это не у меня нет вложенного элемента, как в моем примере. Также пытался использовать совет этой темы, но до сих пор нет костей.

Я думаю, что проблема связана с автоматическим макетом для среднего контейнера, так как он устанавливает ширину до 100% для своего дочернего элемента div, но я не уверен, как это исправить... какой-нибудь совет?