RADMenu MasterPages & CSS

3 posts, 0 answers
  1. JK
    JK avatar
    123 posts
    Member since:
    Sep 2007

    Posted 03 Jun 2008 Link to this post

    Hi,

    I have a very bizarre problem, which I am hoping someone may have some idea in solving...

    I have a application which uses masterpages, on the masterpage is a RADmenu which is connected to a SQL database.  I have created a CSS file which controls the width of the radmenu.

    The formatting works if the menu is in the content section, but does not work in masterpage.  I have found that if you place the stylesheet in the contentpage like this...

    <

    asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">

    <link href="../Menu.Telerik.css" rel="stylesheet" type="text/css" />


    it works, but this is a real pain as it requires me to add this to every page, which sort of destroys the whole point of masterpages.  My understanding is that the page is rendered backwards starting from the contentpage and working out to the masterpage.  What is confusing me is that other elements on the masterpage are formatting correctly, its just the menu, is this a bug or am I being stupid (probably the later :o) ).
     below is my master page.  Any assistance would be greatfully recieved.
    <%@ Master Language="C#"  AutoEventWireup="true" CodeBehind="Masterpage.Master.cs" Inherits="Standard.Site1"  %> 
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"/>  
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head id="Head1" runat="server">  
        <title>UKLPG Standard Application</title> 
        
          
    </head> 
     
    <body> 
        <form id="form1" runat="server">  
            <div id="header">    
        <div id="logo">  
        <h1><asp:Image ID="Image1" runat="server" ImageUrl="~/Images/autogasqc.gif" /></h1>  
        </div> 
        <div id="menu">  
            <table cellpadding="0" cellspacing="0" width="100%">  
                <tr> 
                <td colspan="3" style="width: 553px">  
          
            <asp:SqlDataSource ID="dsTheMenu" runat="server" ConnectionString="<%$ ConnectionStrings:TheConnection %>" 
                SelectCommand="GetItems" SelectCommandType="StoredProcedure" CancelSelectOnNullParameter="False">  
            </asp:SqlDataSource> 
                    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
                    </telerik:RadScriptManager> 
            <table cellpadding=0 cellspacing=0 align="center">      
        <tr>     
            <td>    
                  
            <telerik:RadMenu ID="RadMenu1" Style="z-index:3501;float: inherit;text-align:center;"  runat="server" DataFieldID="ID" DataFieldParentID="Parent" 
                DataMember="DefaultView" DataNavigateUrlField="Url" DataSourceID="dsTheMenu" 
                DataTextField="Title" Skin="Telerik" ClickToOpen="True" SkinID="Standard"  EnableEmbeddedBaseStylesheet="true" > 
                <CollapseAnimation Duration="200" Type="OutQuint"  /> 
                <DefaultGroupSettings Width="10px" /> 
            </telerik:RadMenu> 
             </td></tr></table>     
            </td> 
                    <td style="height: 20px; text-align: center; width: 100px;">  
                        </td> 
                </tr> 
            </table> 
            
          </div>   
          
        </div>   
                                  
     
    <div id="content" style="text-align: left">   
    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">  
        </asp:ContentPlaceHolder> 
          
    </div> 
           
        </form> 
          
    </body> 
    </html> 
  2. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 04 Jun 2008 Link to this post

    Hi JK,

    Have you tried placing the stylesheet link in the master page head tag, i.e.

    <%@ Master Language="C#"  AutoEventWireup="true" CodeBehind="Masterpage.Master.cs" Inherits="Standard.Site1"  %>    
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>    
        
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"/>     
        
    <html xmlns="http://www.w3.org/1999/xhtml" >    
    <head id="Head1" runat="server">     
        <title>UKLPG Standard Application</title>    
        <link href="../Menu.Telerik.css" rel="stylesheet" type="text/css" />         
    </head>    
     

    In addition, please note that in order to use a modified skin you will have to set the menu's EnableEmbeddedSkins property to false. For details on the matter please refer to this help article.

    Best wishes,
    Paul
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. JK
    JK avatar
    123 posts
    Member since:
    Sep 2007

    Posted 04 Jun 2008 Link to this post

    Hi Paul,

    Thanks for your reply.  I am upgrading my website from version 2007 q2 to 2008q1 and the q2 site had a customised css file for the menu.  What I am finding now is that the menus just dont behave like they used to :o(

    thanks for pointing out that embedstylesheet was set to false but that was intentional so the menu would be visible for my boss to review... 

    If it was set to false, the menu would only look correct if I put the CSS file link in the content page, but if I put the stylesheet link in the masterpage it did nothing.  It is also important to note that I am using a theme where I have a master CSS file in there.  This is why I made the comment about the rendering starting from the content page then out to the master page. 

    I have had to completely rewrite the header section of the master css file to get the menu to fit.  Its not perfect but will suffice for the time being.. 

Back to Top