If you want the menu look to comply with your web site theme, you may need to change images used by the skin.
The simplest way is to modify one of the ready-made skins.
Example
The below example uses the Outlook skin as a starting point.
To change images in the Outlook skin:
- Create a copy of the RadControls/Skins/Outlook folder in the same parent folder, i.e. RadControls/Skins. Rename the copied Outlook folder to MyOutlook.
- Open the CSS file and replace Outlook with MyOutlook globally. The theme name corresponds to the CSS class of the menu.
The following CSS selectors define the images inside the skin:
- .RadMenu_MyOutlook li a
the background property defines the left enclosing image;
-
- .RadMenu_MyOutlook li a .wrap
the background property defines the right enclosing image;
-
- .RadMenu_MyOutlook li a .innerWrap
the background property defines the background image behind the item text.
If you change the images, you may also change the padding-left value of the li a selector and the padding-right value of the .wrap selector. These should (generally) be equal to the width of the images, otherwise the innerWrap span will spread over the containers fully, effectively hiding the enclosing images.
See Also