Border: How To Remove

5 posts, 1 answers
  1. Martin
    Martin avatar
    39 posts
    Member since:
    Jan 2007

    Posted 18 Aug 2008 Link to this post

    Hi,

    Simple request. I would like to remove the border around the panelbar. It would appear that if I set the BorderWidth="0" does not do it.

    Example of what I am trying shown below:-

            <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Outlook" BorderWidth="0px">  
                <Items> 
                    <telerik:RadPanelItem Text="Locations" Expanded="true" BorderWidth="0px">  
                        <ItemTemplate><p>Hello Telerik</p></ItemTemplate>      
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelBar> 
     

    Is there a Css style I need to override instead?

    Thanks,
    Martin
  2. Answer
    Paul
    Admin
    Paul avatar
    4281 posts

    Posted 18 Aug 2008 Link to this post

    Hello Martin,

    Please find below a sample code snippet that shows the needed approach.

    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <title>Untitled Page</title> 
        <style type="text/css">  
        .RadPanelBar_Outlook .rpRootGroup,  
        .RadPanelBar_Outlook .rpRootGroup .rpLink  
        {  
            border: none !important;  
        }  
        </style> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
            <div> 
                <asp:ScriptManager ID="ScriptManager1" runat="server">  
                </asp:ScriptManager> 
                <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Outlook">  
                    <Items> 
                        <telerik:RadPanelItem Text="Locations" runat="server">  
                            <Items> 
                                <telerik:RadPanelItem runat="server">  
                                    <ItemTemplate> 
                                        Hello Telerik  
                                    </ItemTemplate> 
                                </telerik:RadPanelItem> 
                            </Items> 
                        </telerik:RadPanelItem> 
                    </Items> 
                    <CollapseAnimation Duration="100" Type="None" /> 
                    <ExpandAnimation Duration="100" Type="None" /> 
                </telerik:RadPanelBar> 
        </form> 
    </body> 
    </html> 
     


    Sincerely yours,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Brian Azzi
    Brian Azzi avatar
    65 posts
    Member since:
    Mar 2010

    Posted 31 Oct 2011 Link to this post

    I realize this post is a bit old... but I think it is still relevant. The problem I'm having is that I have 3 or 4 panel bars in my application... but I only want to remove the border on one. Why in the world would you guys make the Border and BorderStyle properties not work? (Why are they there if they are always overridden by the skin?). 

    Anyway, I'm just using the black skin (set at the application level)... any help would be appreciated!

    Thanks,
    -Brian
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Nov 2011 Link to this post

    Hi Brian,

    You can use the following css class selector and the CssClass property of the RadPanelBar whose border you need to remove:
    div.New .rpRootGroup
           {
               border-width: 0px;
           }

    markup:
    <telerik:RadPanelBar ID="RadPanelBar1" Skin="Black" runat="server"  CssClass="New" >

    Regards,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  6. Brian Azzi
    Brian Azzi avatar
    65 posts
    Member since:
    Mar 2010

    Posted 02 Nov 2011 Link to this post

    Perfect! Thanks!

    -Brian
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017