Scrollbars disappear in a masterpage with viewport

  1. #1

    Scrollbars disappear in a masterpage with viewport

    Hello everyone.
    I have a strange problem with the attribute "autoscroll"of which I can not find the solution.
    If I use a viewport control with some contents in a single page the scrollbars are displayed correctly (see attached OnePage.jpg) if these controls are placed in a content page and the viewport in a masterpage the scrollbars disappear (see attached WithMasterPage.jpg).
    Someone can explain to me what I'm missing?

    This is the complete page.

        <ext:ResourceManager ID="ResourceManager1" runat="server">
        </ext:ResourceManager>
        <ext:Viewport ID="Viewport1" runat="server" Layout="Fit">
            <Items>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <North>
                        <ext:Panel ID="pnlNorth" runat="server" Height="80" Border="false" Header="false">
                            <Content>
                                <p>
                                    Page title here</p>
                            </Content>
                        </ext:Panel>
                    </North>
                    <West Collapsible="true" Split="true" MinWidth="175" MaxWidth="400" MarginsSummary="0 0 0 0"
                        CMarginsSummary="0 0 0 0">
                        <ext:Panel runat="server" Width="200" ID="pnlSettings" Title="Menu">
                            <Content>
                                <p>
                                    Menu controls here</p>
                            </Content>
                        </ext:Panel>
                    </West>
                    <Center>
                        <ext:Panel ID="Panel1" runat="server" Header="false" Layout="Fit">
                            <Content>
                                <ext:Panel ID="Panel10" runat="server" Title="Title" AutoScroll="true" Border="false">
                                    <TopBar>
                                        <ext:Toolbar ID="Toolbar1" runat="server">
                                            <Items>
                                                <ext:Button ID="btnSave" runat="server" Text="Button1" AutoPostBack="True">
                                                </ext:Button>
                                            </Items>
                                        </ext:Toolbar>
                                    </TopBar>
                                    <Content>
                                        <ext:Panel ID="Panel6" runat="server" Header="false" Border="false">
                                            <Content>
                                                <ext:Panel ID="Panel5" runat="server" Border="false" Title="Panel" BodyStyle="padding: 10px 0 10px 0;">
                                                    <Content>
                                                        <div style="height: 300px;">
                                                            <p>
                                                                Some content here</p>
                                                        </div>
                                                    </Content>
                                                </ext:Panel>
                                                <ext:TabPanel ID="TabPanel1" runat="server" Border="false">
                                                    <Items>
                                                        <ext:Panel ID="Panel4" runat="server" Title="Tab1">
                                                            <Content>
                                                                <div style="height: 300px;">
                                                                    <p>
                                                                        Some content here</p>
                                                                </div>
                                                            </Content>
                                                        </ext:Panel>
                                                        <ext:Panel ID="Panel3" runat="server" Title="Tab2">
                                                            <Content>
                                                                <div style="height: 300px;">
                                                                    <p>
                                                                        Some content here</p>
                                                                </div>
                                                            </Content>
                                                        </ext:Panel>
                                                    </Items>
                                                </ext:TabPanel>
                                                <ext:Panel ID="Panel2" runat="server" Border="false" Title="Panel">
                                                    <Content>
                                                        <div style="height: 300px;">
                                                            Some content here</div>
                                                    </Content>
                                                </ext:Panel>
                                            </Content>
                                        </ext:Panel>
                                    </Content>
                                </ext:Panel>
                            </Content>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Items>
        </ext:Viewport>
    While this is divided in master / content.

    Masterpage:

        <ext:resourcemanager id="ResourceManager1" runat="server">
        </ext:resourcemanager>
        <ext:viewport id="Viewport1" runat="server" layout="Fit">
            <Items>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <North>
                        <ext:Panel ID="pnlNorth" runat="server" Height="80" Border="false" Header="false">
                            <Content>
                                <p>
                                    Page title here</p>
                            </Content>
                        </ext:Panel>
                    </North>
                    <West Collapsible="true" Split="true" MinWidth="175" MaxWidth="400" MarginsSummary="0 0 0 0"
                        CMarginsSummary="0 0 0 0">
                        <ext:Panel runat="server" Width="200" ID="pnlSettings" Title="Menu">
                            <Content>
                                <p>
                                    Menu controls here</p>
                            </Content>
                        </ext:Panel>
                    </West>
                    <Center>
                        <ext:Panel ID="Panel1" runat="server" Header="false" Layout="Fit">
                            <Content>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
                            </Content>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Items>
        </ext:viewport>
    Content page:

        <ext:Panel ID="Panel10" runat="server" Title="Title" AutoScroll="true" Border="false">
            <TopBar>
                <ext:Toolbar ID="Toolbar1" runat="server">
                    <Items>
                        <ext:Button ID="btnSave" runat="server" Text="Button1" AutoPostBack="True">
                        </ext:Button>
                    </Items>
                </ext:Toolbar>
            </TopBar>
            <Content>
                <ext:Panel ID="Panel6" runat="server" Header="false" Border="false">
                    <Content>
                        <ext:Panel ID="Panel5" runat="server" Border="false" Title="Panel" BodyStyle="padding: 10px 0 10px 0;">
                            <Content>
                                <div style="height: 300px;">
                                    <p>
                                        Some content here</p>
                                </div>
                            </Content>
                        </ext:Panel>
                        <ext:TabPanel ID="TabPanel1" runat="server" Border="false">
                            <Items>
                                <ext:Panel ID="Panel4" runat="server" Title="Tab1">
                                    <Content>
                                        <div style="height: 300px;">
                                            <p>
                                                Some content here</p>
                                        </div>
                                    </Content>
                                </ext:Panel>
                                <ext:Panel ID="Panel3" runat="server" Title="Tab2">
                                    <Content>
                                        <div style="height: 300px;">
                                            <p>
                                                Some content here</p>
                                        </div>
                                    </Content>
                                </ext:Panel>
                            </Items>
                        </ext:TabPanel>
                        <ext:Panel ID="Panel2" runat="server" Border="false" Title="Panel">
                            <Content>
                                <div style="height: 300px;">
                                    Some content here</div>
                            </Content>
                        </ext:Panel>
                    </Content>
                </ext:Panel>
            </Content>
        </ext:Panel>

    Thanks for the help.
    Attached Thumbnails Click image for larger version. 

Name:	OnePage.jpg 
Views:	67 
Size:	45.3 KB 
ID:	2589   Click image for larger version. 

Name:	WithMasterPage.jpg 
Views:	65 
Size:	44.1 KB 
ID:	2588  

Similar Threads

  1. [CLOSED] HTMLEditor and scrollbars
    By krzak in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Feb 28, 2011, 1:15 PM
  2. Masterpage ViewPort FitLayout
    By w0rtez in forum 1.x Help
    Replies: 0
    Last Post: Sep 28, 2010, 3:30 PM
  3. [CLOSED] How do I fix these scrollbars?
    By jmcantrell in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Jun 22, 2010, 1:48 PM
  4. [CLOSED] GridPanel scrollbars
    By danielg in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: May 21, 2009, 1:01 AM
  5. Replies: 3
    Last Post: Nov 03, 2008, 1:35 PM

Posting Permissions