Menu / Mega Drop-Down example

[Martin Horst]

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

[Kate]

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