Problem with scrollbar inside Panel (even through Ext Designer)

[raskri]

This is a simple copy from the designer.
It works fine in Firefox, but Ie7 and Ie8 messes up the scroll bar inside the panel.

Am I missing something?

  MyWindowUi = Ext.extend(Ext.Window, {
        title: 'My Window',
        width: 508,
        height: 300,
        layout: 'fit',
        initComponent: function() {
            this.items = [
                {
                    xtype: 'panel',
                    title: 'Tab 1',
                    frame: true,
                    bodyStyle: 'padding: 15px 15px;',
                    autoScroll: true,
                    items: [
                        {
                            xtype: 'container',
                            autoEl: 'div',
                            layout: 'form',
                            labelAlign: 'right',
                            items: [
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'textfield',
                                    fieldLabel: 'Label',
                                    anchor: '100%'
                                },
                                {
                                    xtype: 'fieldset',
                                    title: 'My Fields',
                                    layout: 'form',
                                    items: [
                                        {
                                            xtype: 'textfield',
                                            fieldLabel: 'Label',
                                            anchor: '100%'
                                        },
                                        {
                                            xtype: 'textfield',
                                            fieldLabel: 'Label',
                                            anchor: '100%'
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                }
            ];
            MyWindowUi.superclass.initComponent.call(this);
        }
    });

    // I added this
    new MyWindowUi().show();

[Animal]

But why would you have Window which contains a Panel which contains a Container housing your inputs?

Why wouldn't you just put them in the Window?

Just another example of the Designer still requiring thought, knowledge and design.

Better to just learn and write 20 lines of code which you can comment and then maintain!

[raskri]

That was just an example, a simplification of what I need. I reproduced my problem in the Designer. With minimal code for it to be easily understood and to get help.

Anyway, having a Window which contains a Panel which contains a Container(which has FormLayout) which contains FormFields, should work, right?

What I need is a window with a tabpanel, and inside one of the tabs, two containers with form fields:
firefox:Firefox_3.6.jpg
ie7:Ie8.png
ie8:IE7.JPG.jpg

[Animal]

It will work (with inefficiency) if you specify which layout manager you want to size each child Component.

You see you STILL have to work out, and specify how you want child Components sized. The Ext Designer won't TELL you what to do, you tell IT.

Just the same as writing the code. Only much slower! And you can't cast your eyes over it and understand it, and see where to go in and modify. You just have a WYSIWYG thing which hides all this stuff from maintainers, making it a nightmare to maintain.