Change Formatting Style Of The Menu

7 posts, 0 answers
  1. Seth
    Seth avatar
    66 posts
    Member since:
    Oct 2009

    Posted 24 May 2013 Link to this post

    I have the menu built into a header on my application.  I am using the new Glow skin and I would like to remove the border around the menu.  What style do I need to override to remove that border?
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 26 May 2013 Link to this post

    Hi,

    Try the following CSS.

    CSS:
    html .RadMenu_Glow .rmRootGroup
    {
     border: 0 none !important;
    }

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 07 Apr in reply to Princy Link to this post

    Hi

     

    This is an old post but I am re-visiting a legacy application using Q3 2013 controls, in particular the GLOW menu.

    The code below changes the background colour but leaves a black border, which I want to get rid of. What am I doing wrong here?

    Thanks

    .RadMenu_Glow .rmText
        {
            background-color: #005daa !important;
        }
     .RadMenu_Glow .rmRootGroup
    {
     border: 0 none !important;
    }

  5. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 12 Apr Link to this post

    Hi Clive,

    We have applied the CSS to the RadMenu in classic render mode (as the styles seems to be not adapted to lightweight render mode), but there is not a black border around the menu. We are sending you this video for your reference. Could you please modify the sample project in the attachment and open a support ticket to be able to send back us a modified version where the issue is reproduced?

    Regards,
    Magdalena
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  6. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 12 Apr in reply to Magdalena Link to this post

    Hi Magdalena

    Thanks for the video, and I get exacty the same result running the page on my machine.

    I don't have any support ticket credits available to me so I can't send a running example, but in any case when I paused on the demo, and zoomed in, I could still see a slight grey border (see attached screenshot), but it is not very noticeable on a white background.

    However when I added a div round the menu in your demo to put the menu on the same blue background as here:

    <div style="height:40px; background-color: #005daa; padding-top:3px; padding-left:10px;">

            <telerik:RadMenu runat="server" Skin="Glow" RenderMode="Classic">
                <Items>
                    <telerik:RadMenuItem Text="Item" />
                    <telerik:RadMenuItem Text="Item" />
                    <telerik:RadMenuItem Text="Item" />
                    <telerik:RadMenuItem Text="Item" />
                    <telerik:RadMenuItem Text="Item" />
                </Items>
            </telerik:RadMenu>

    </div>

    I get a more conspicuous (darker border) border. See attached screenshot.

    It seems like the border of some kind is still there.

     

    Thanks for your support!

     

    Clive

     

  7. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 14 Apr Link to this post

    Hello Clive,

    We have succeeded to reproduce the issue. The "border" is not a border, but shadows. It can be removed by applying the following CSS:
    html .RadMenu_Glow .rmRootGroup {
        box-shadow: none;
    }


    Regards,
    Magdalena
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  8. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 15 Apr in reply to Magdalena Link to this post

    Thanks for this gem! 

    In summary, what works to have no 'border' at all is

    .RadMenu_Glow .rmRootGroup {
        box-shadow: none !important;
        border: none !important;
    }

     

    Regards

    Clive

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