Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Menu > Menu / Mega Drop-Down example

• Martin Horst

  Posted on Feb 1, 2012 (permalink)

  Hi,

  I'm trying to create a menu item like the one in the mega dropdown example.

  Mega Drop Down

  I've added my own html code to one of my RadMenuItem elements which is working fine.

  My only problem now is how i can remove the skined background (I'm using the WebBlue skin) and

  replace it with a plane white background. The realy importent css classes used in the example 

  (like "Products") unfortunately are not part of the source code.

  Best regards

  Martin Horst

  Reply

• Kate Kate

  Posted on Feb 1, 2012 (permalink)

  Hi Martin,
  
  Using the following css class selector you can remove the background image that is applied to the WebBlue skin of the RadMenu:
  

  /*background image as hover effect of both root and child items */

  div.RadMenu_WebBlue .rmRootGroup,

  div.RadMenu_WebBlue a.rmLink,

  div.RadMenu_WebBlue .rmText,

  div.RadMenu_WebBlue .rmLeftArrow,

  div.RadMenu_WebBlue .rmRightArrow,

  div.RadMenu_WebBlue .rmTopArrow,

  div.RadMenu_WebBlue .rmBottomArrow {

         background-image: none;

  }

   

  /*background and border of the root items */

  div.RadMenu_WebBlue .rmRootGroup {

      background-color: #627F97;

      border: 1px solid #3D556C;

  }

   

  /*dropdown background image applied */

  div.RadMenu_WebBlue .rmGroup,

  div.RadMenu_WebBlue .rmMultiColumn,

  div.RadMenu_WebBlue .rmGroup .rmVertical {

      background-image: none;

      border: 1px solid #768CA5;

  }

  
  Greetings,
  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

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Menu > Menu / Mega Drop-Down example