Ajax PostBack background color

2 posts, 0 answers
  1. Osmon
    Osmon avatar
    10 posts
    Member since:
    Aug 2010

    Posted 04 Oct 2010 Link to this post

    Hi,
          I have some background issue. It may also be  connected to how i am building my master page using ajaxpanel and ajaxmanager, etc. here is a what i have in the master page.

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" 
            DefaultLoadingPanelID="RadAjaxLoadingPanel1">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadMenu1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="masterContent" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="crumbs">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadMenu1" />
                        <telerik:AjaxUpdatedControl ControlID="masterContent" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                  
            </AjaxSettings>
              
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default">
        </telerik:RadAjaxLoadingPanel>
        <div>
    <table width="100%"  border="5">
      <tr>
        <td class="noprint" id="masterHeader1" colspan="2">
            <img alt="All Languages Logo" src="Images/logo.gif" style="border: 1px; border-color:Silver; vertical-align:top;" />
            <span style="font-family:Arial; font-size:18px;font-weight:bolder;">Customer Web Portal</span><br />
            <span style="font-size:9px"><asp:LoginName ID="ln" FormatString="Logged in as: {0}" runat="server"/></span>
        </td>
      </tr>
      <tr>
        <td valign="top" width="175px">                
                <telerik:RadMenu ID="RadMenu1" Runat="server" style="z-index:2900"
                    DataSourceID="SiteMapDataSource1" EnableRoundedCorners="True" Width="175px"
                    EnableShadows="True" Flow="Vertical">
                </telerik:RadMenu>
        </td>
        <td valign="top" width="95%">        
                 
              
            <telerik:RadAjaxPanel ID="pnlContent" runat="server" HorizontalAlign="Left" LoadingPanelID="RadAjaxLoadingPanel1">
                  
                  
      
                <table>
            <tr>
                <td id="breadcrumbs" class="noprint">
                      
                    <asp:SiteMapPath ID="crumbs" runat="server" CurrentNodeStyle-CssClass="hide" PathSeparator=" : "  >
                        <CurrentNodeStyle CssClass="hide" />
                    </asp:SiteMapPath>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:SiteMapPath ID="title" ParentLevelsDisplayed="0" CurrentNodeStyle-Font-Size="Large" runat="server"  >
                        <CurrentNodeStyle Font-Size="Large" />
                    </asp:SiteMapPath>
                </td>
            </tr>      
            <tr>
                <td  id="pageContent">
                    <asp:contentplaceholder id="Main" runat="server"></asp:contentplaceholder>
                </td>
            </tr>
           </table>
             
            </telerik:RadAjaxPanel>

           I am just using the ajaxpanel so i do not have to configure the manager self referenced calls as most of the stuff would be going on inside  the main panel. Otherwise i should have actually just use one ajaxpanel for the whole page. 

    ISSUE:
                 Attached are some screen shots. I have probably 2 issues:

    1-On first load, the visible area of the page (without scrol bar) has the white color but the overflowed area is greyish, why ? and how can i fix it ?

    2-On post back, all the empty area of the page (white before) but inside the panel (probably) changes the color to grey. why does it change. I want consistent look, either white or grey but it should stay all the time.

    Please help. Thanks,

    Regards,

    Osman
  2. Dimo
    Admin
    Dimo avatar
    8472 posts

    Posted 05 Oct 2010 Link to this post

    Hello Osmon,

    The provided code snippet is not enough to determine the exact cause of the problem.

    The 100% wide <table>s actually expand beyond 100% if they cannot enclose their content. However, <div>s do not do that, so you may end up with a <div>, which is as wide as the browser window and a <table> inside it, which is wider and overflows. Such a scenario may cause some backgrounds to look out of place.

    Changes in styling after an AJAX request may be caused by changing the order of registered <link> elements (CSS files) and <style> elements (CSS styles in the page <head>). To overcome such an issue, you should use CSS styles only in external files or change the specificity of the selectors in the <style> element.

    If you need further assistance, please provide a full standalone runnable web page for us to inspect locally.

    Regards,
    Dimo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top