Ext version tested:
  • Ext 4.1.1

Browser versions tested against:
  • IE8
  • FF 14.0.1 (firebug installed)
  • Chrome 13

DOCTYPE tested against:
  • HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ""

  • Border layout is broken when resizing window. Minimum width for center region is not taken in affect on resizing window.

Steps to reproduce the problem:
  • Create window widget
  • Add two regions: center and east
  • Specify minWidth for center region
  • Specify maxWidth for east region
  • Resize window - make smaller width

The result that was expected:
  • Center region width equals to minWidth|window width
  • East region has smaller width

The result that occurs instead:
  • Layout is broken
  • Center region width is incorrectly affected by minWidth configuration

Test Case:
    Ext.create('Ext.Window', {
        title: 'Bottom Header',
        width: 500,
        height: 350,
        headerPosition: 'bottom',
        layout: {
            type: 'border'
        items: [{
            region: 'center',
            minWidth: 150,
            style: 'text-align: center',
            html: 'CENTER REGION',
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'bottom',
                items: [{
                    text: 'First'
                    text: 'Second'
                    text: 'Third'
                    text: 'Fourth'
            region: 'east',
            collapsible: true,
            width: 200,
            maxWidth: 200,
            split: true,
            style: 'text-align: right',
            html: 'RIGHT REGION'
Screenshot or Video:

Debugging already done:
  • none

Possible fix:
  • not provided

Additional CSS used:
  • only default ext-all.css

Operating System:
  • Win7
  • WinXP Pro