Forums Retired Products and Controls
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
hasca
170
webtab - webgrid - overflow, position problem
posted

I have a webgrid in a webtab contentpane. But gridview always overflow outside of contentpane. I could not I fix it.

Could anyone tell what is missing?

Mz source code is:

 

        <table id="tblMain" border="1" cellpadding="0" cellspacing="0" style="width: 100%;
                height: 600px; border: solid 1px LightBlue; table-layout: fixed;">
                <tr>
                    <td runat="server" id="tdTree" style="width: 300px; text-align: left; vertical-align: top;
                        background-color: ButtonFace; height: 600px;">
                        <div id="divTree" style="overflow: auto; width: 300px; height: 600px;
                            scrollbar-3dlight-color: Gray; scrollbar-arrow-color: Gray; scrollbar-track-color: lightsteelblue;
                            scrollbar-darkshadow-color: Gray; scrollbar-face-color: lightsteelblue; scrollbar-highlight-color: Black;
                            scrollbar-shadow-color: Black; border:none 0px ;">
                            <div style="padding-top: 5px; padding-left: 2px;">
                                <fieldset id="fldsNav" style="border: 0px; width: 100%; height: 100%; overflow: visible;">
                                    <legend id="lgdNav" style="background-color: Silver; color: White; font-weight: bold;
                                        font-size: 11pt; padding-top: 1px; padding-left: 2px; padding-right: 2px; padding-bottom: 0px;
                                        border-left: solid 1px white; border-right: solid 1px white; border-top: solid 1px white;
                                        border-bottom: none;">Navigation Explorer</legend>
                                    <asp:UpdatePanel ID="upnNav" runat="server">
                                        <ContentTemplate>
                                           //navigation items.
                                        </ContentTemplate>
                                    </asp:UpdatePanel>
                                </fieldset>
                            </div>
                        </div>
                    </td>
                    <td id="tdMid" style="background-color: lightsteelblue; height: 600px; width: 6px">
                    </td>
                    <td id="tdContent" style="height: 600px; vertical-align: top; text-align: left; background-color: gainsboro;">
                        <asp:UpdatePanel ID="upnTabs" runat="server">
                            <ContentTemplate>
                                <igtab:UltraWebTab ID="uwtChilds" runat="server" EnableAppStyling="True" FixedLayout="false"
                                    Height="600px" Width="100%" OnTabClick="uwtChilds_TabClick" CustomRules="">
                                    <Tabs>
                                        <igtab:Tab Text="test">
                                        <ContentPane Scrollable="Auto">
                                        </ContentPane>
                                       
                                        <ContentTemplate>
                                        <igtbl:UltraWebGrid ID="uwgContent" runat="server" EnableAppStyling="True"  OnPageIndexChanged="uwgContent_PageIndexChanged">
    <Bands>
        <igtbl:UltraGridBand>
            <AddNewRow View="NotSet" Visible="NotSet">
            </AddNewRow>
        </igtbl:UltraGridBand>
    </Bands>
    <DisplayLayout AllowColSizingDefault="Free" AllowColumnMovingDefault="OnClient" AllowSortingDefault="OnClient"
        BorderCollapseDefault="Separate" HeaderClickActionDefault="SortMulti" Name="ctl00xuwgContent"
        RowHeightDefault="20px" RowSelectorsDefault="No" ScrollBar="Never" SelectTypeRowDefault="Extended"
        StationaryMargins="Header" StationaryMarginsOutlookGroupBy="True" TableLayout="Fixed"
        Version="4.00" ViewType="OutlookGroupBy">
        <FrameStyle BackColor="Window" BorderColor="InactiveCaption" BorderStyle="Solid"
            BorderWidth="1px" Font-Names="Microsoft Sans Serif" Font-Size="8.25pt" CustomRules="position:relative;"
            >
        </FrameStyle>
        <Images ImageDirectory="~/appResource/Office2007Silver/WebGrid/">
        </Images>
        <Pager AllowPaging="True" MinimumPagesForDisplay="2" PageSize="20" Alignment="Left">
            <Style BackColor="LightGray" BorderStyle="Solid" BorderWidth="1px">
<BorderDetails ColorLeft="White" ColorTop="White" WidthLeft="1px" WidthTop="1px"></BorderDetails>
</Style>
        </Pager>
        <EditCellStyleDefault BorderStyle="None" BorderWidth="0px">
        </EditCellStyleDefault>
        <FooterStyleDefault BackColor="LightGray" BorderStyle="Solid" BorderWidth="1px">
            <BorderDetails ColorLeft="White" ColorTop="White" WidthLeft="1px" WidthTop="1px" />
        </FooterStyleDefault>
        <HeaderStyleDefault BackColor="LightGray" BorderStyle="Solid" HorizontalAlign="Left">
            <BorderDetails ColorLeft="White" ColorTop="White" WidthLeft="1px" WidthTop="1px" />
        </HeaderStyleDefault>
        <RowStyleDefault BackColor="Window" BorderColor="Silver" BorderStyle="Solid" BorderWidth="1px"
            Font-Names="Microsoft Sans Serif" Font-Size="8.25pt">
            <Padding Left="3px" />
            <BorderDetails ColorLeft="Window" ColorTop="Window" />
        </RowStyleDefault>
        <GroupByRowStyleDefault BackColor="Control" BorderColor="Window">
        </GroupByRowStyleDefault>
        <GroupByBox>
            <Style BackColor="ActiveBorder" BorderColor="Window"></Style>
        </GroupByBox>
        <AddNewBox Hidden="False">
            <Style BackColor="Window" BorderColor="InactiveCaption" BorderStyle="Solid" BorderWidth="1px">
<BorderDetails ColorLeft="White" ColorTop="White" WidthLeft="1px" WidthTop="1px"></BorderDetails>
</Style>
        </AddNewBox>
        <ActivationObject BorderColor="" BorderWidth="">
        </ActivationObject>
        <FilterOptionsDefault AllowRowFiltering="OnClient">
            <FilterDropDownStyle BackColor="White" BorderColor="Silver" BorderStyle="Solid" BorderWidth="1px"
                CustomRules="overflow:auto;" Font-Names="Verdana,Arial,Helvetica,sans-serif"
                Font-Size="11px" Height="300px" Width="200px">
                <Padding Left="2px" />
            </FilterDropDownStyle>
            <FilterHighlightRowStyle BackColor="#151C55" ForeColor="White">
            </FilterHighlightRowStyle>
            <FilterOperandDropDownStyle BackColor="White" BorderColor="Silver" BorderStyle="Solid"
                BorderWidth="1px" CustomRules="overflow:auto;" Font-Names="Verdana,Arial,Helvetica,sans-serif"
                Font-Size="11px">
                <Padding Left="2px" />
            </FilterOperandDropDownStyle>
        </FilterOptionsDefault>
    </DisplayLayout>
</igtbl:UltraWebGrid>

                                        </ContentTemplate>
                                        </igtab:Tab>
                                    </Tabs>
                                </igtab:UltraWebTab>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </td>
                </tr>
            </table>

Parents
No Data
Reply
  • 24497
    posted

    Hi,

    That happens because grid uses position:relative for its html elements.

    The latest version (hot fixes) of UltraWebTab has new property ContentPane.EnableRelativeLayout. That will fix your problem. Otherwise, you need to insert into ContentTemplate 

    <div style='width:100%;height:100%;position:relative;'>...</div>

     and move all your content into that div (replace ...)

Children