I have the following North Panel (of border layout) in my application (using 0.6):

                   <North>                        
                        <ext:Panel ID="Panel1" Frame="true" runat="server" Height="110px">
                            <Content>
                                <ext:ColumnLayout ID="ColumnLayout1" runat="server">
                                    <ext:LayoutColumn>
                                        <ext:Panel ID="LogoPanel" runat="server" Height="100" Width="250" BodyBorder="false" Border="false">
                                            <Content><img class="logo" alt="" src="images/logo.png" /></Content>
                                        </ext:Panel>
                                    </ext:LayoutColumn>
                                    <ext:LayoutColumn ColumnWidth="0.4">
                                        <ext:Panel ID="TopLevelButtonsColumn" runat="server" Height="100" Border="false" BodyBorder="false"  BodyStyle="padding: 2px 1px;">
                                            <Content>
                                                <ext:Panel ID="OrgButtonsPanel" Footer="true" runat="server" Height="94" Frame="true" Border="false" BodyStyle="text-align:center;">
                                                    <Content>                                                                                                
                                                    </Content>
                                                    <Listeners>
                                                        <Render Fn="function(c){c.footer.replaceClass('x-panel-footer', 'x-panel-header');c.footer.createChild({tag:'span', cls:'x-panel-header-text', html: 'Organisation' })}" />
                                                    </Listeners>
                                                </ext:Panel>                                            
                                            </Content>
                                        </ext:Panel>
                                    </ext:LayoutColumn>
                                    <ext:LayoutColumn ColumnWidth="0.4">
                                        <ext:Panel ID="QuestionButtonsColumn" runat="server" Height="100" Border="false" BodyBorder="false" BodyStyle="padding: 2px;">
                                            <Content>
                                                <ext:Panel ID="QuestionButtonsPanel" Footer="true" runat="server" Height="94" Frame="true" Border="false" BodyStyle="text-align:center" >
                                                    <Content>                                                        
                                                    </Content>
                                                    <Listeners>
                                                        <Render Fn="function(c){c.footer.replaceClass('x-panel-footer', 'x-panel-header');c.footer.createChild({tag:'span', cls:'x-panel-header-text', html: 'Question'})}" />
                                                    </Listeners>                                                    
                                                </ext:Panel>                                            
                                            </Content>
                                        </ext:Panel>
                                    </ext:LayoutColumn>
                                    <ext:LayoutColumn ColumnWidth="0.2">
                                        <ext:Panel ID="Panel7" runat="server" Height="100" Border="false">
                                            <Content>

                                            </Content>
                                        </ext:Panel>
                                    </ext:LayoutColumn>
                                </ext:ColumnLayout>
                            </Content>                                                 
                        </ext:Panel>
                                           
                    </North>
I .Hide() the 'OrgButtonsPanel' and 'QuestionButtonsPanel' in the code behind at Page_Load and then at run time (when needed) add/remove buttons to these panels and show them ( using ext panelID.show() method )

Because the buttons are added and removed to the panels at run time, I want these panels to be AutoWidth to adjust to their content automatically.

Now when I add an AutoWidth=true to the 'OrgButtonsColumn' and 'QuestionButtonsColumn', it works fine in FF but in IE the first Panel (normally OrgButtonsPanel) that is showed expands over the full width of the North panel and then even if the other panels are .show()ed they are not shown at all.

Setting AutoWidth=false sets the widths of the panels to the specified 250px, 0.4, 0.4 and 0.2 fixed which in many cases occupies more space than required i.e. with little content/buttons.

Can anyone please suggest a solution? thanks