I'm getting a strange issue with a panel when I resize it. It's getting clipped by a scrollbar's width such that the collapse tool is partially hidden.


My test case may seem a little perverse but it was the simplest way I could find to demonstrate the clipping effect. It works fine against 4.0.x. Note that even though sizes are specified in the CSS this is not a case of auto-sizing.

#main {
    border: 1px solid red;
    height: 300px;
    overflow-y: auto;
    width: 300px;

#inner {
    border: 1px solid green;
HTML Code:
    <div id="main"><div id="inner"></div></div>
Ext.create('Ext.panel.Panel', {
    collapsible: true,
    height: 400,
    renderTo: 'inner',
    title: 'Panel',
    width: 200,
    listeners: {
        resize: function(panel) {
            var el = Ext.get('inner');

            panel.setWidth(el.getWidth() - el.getFrameWidth('lr'));
To see the problem just collapse the panel.