REQUIRED INFORMATION

Ext version tested:
  • Ext 4.1.1
Browser versions tested against:
  • IE8
  • FF 14.0.1 (firebug 1.10.0.1 installed)
  • Chrome 13
DOCTYPE tested against:
  • HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"
Description:
  • 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:
Code:
     Ext.onReady(function(){
    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'
        }]
    }).show();
});
HELPFUL INFORMATION
Screenshot or Video:
Debugging already done:
  • none
Possible fix:
  • not provided
Additional CSS used:
  • only default ext-all.css
Operating System:
  • Win7
  • WinXP Pro