ext 4.1.1 - hbox layout doesn't appear to see pack: 'center'

[droesler]

I saw some discussion about this and it was CLOSED, but I'm having issues with this converting an ext 3.x app to 4.x.

Below is the code for the north region in a Viewport layout. Everything works except pack: 'center'. Each of the items are at the left of their containers. Just to see what would happen I changed it to pack: 'right' and there was no difference. Am I missing something?

Thanks

Dennis

Ext.create('Ext.container.Container', {        // north region
   region: 'north',
   id: 'clientTitle',
   baseCls: 'x-plain',
   margins: '10 0 0 0',
   height: 65, // give north region a height
   layout: {
      type: 'hbox',
      pack: 'center',
      align: 'middle'
   },
   items: [
      {
         xtype: 'container',
         flex: .5,
         autoEl: {
            cls:  'image',
            tag: 'img',
            src: '/images/my_image.png'
         }
      },
      {
         xtype: 'container',
         flex: 2,
         id : 'myTitle',
         autoEl: {
            tag: 'div',
            cls: 'title',
            html:'My Title'
         }
      },
      {
         xtype: 'container',
         flex: .5,
         autoEl: {
            tag: 'div',
            cls: 'version',
            html: 'test'
         }
      }
   ]
})

[Animal]

They're all flexed, so all space is going to be used.

[droesler]

The flex part is working as expected, but how do I get the values in each of the containers of the items property to align to the horizontal center of those containers?