missing contextmenu icons

[John]

My contextmenu icons are missing or distorted somehow, I use the same icon set for my custom toolbar with out any problems.  I believe the url to the icons to be correct since it works for the custom tool bar.  See attached image for example of appearance, also embedded is c# to create and css "toolfile".  I am using version 2010.3.1109.40 of Telerik.Web.UI.  Thanks in advance for any thoughts on the issue.

Create instance in code behind;

...
                    /*
                     * Standard users have no need of context menus
                     */
                    RadEditor1.ContextMenus.Clear();

                    /*
                     * Add the edit personal note
                     */
                    EditorContextMenu ecm = new EditorContextMenu();
                    ecm.TagName = "IMG";
                    //add specific tools to the context menu
                    EditorTool et = new EditorTool("Edit_Personal_Note");
                    ecm.Tools.Add(et);
                    //add the newly created context menu to the context menu collection
                    RadEditor1.ContextMenus.Add(ecm);

                    /*
                     * Add the delete personal note
                     */
                    et = new EditorTool("Delete_Personal_Note");
                    ecm.Tools.Add(et);
                    //add the newly created context menu to the context menu collection
                    RadEditor1.ContextMenus.Add(ecm);
...

/*

 * Editor Tool Bar

 */

.reTool .Personal_Notes

{

    background-image: url(../../images/PersonalNotes.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

.reTool .Edit_Personal_Note

{

    background-image: url(../../images/Edit_Personal_Note.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

.reTool .Delete_Personal_Note

{

    background-image: url(../../images/DeletePersonalNote.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

.reTool .Public_Notes

{

    background-image: url(../../images/PublicNotes.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

/*

 * Context Menu Tool bar (Note that path is same as for toolbar above and the toolbar works


 */

.Edit_Personal_Note

{

    background-image: url(../../images/Edit_Personal_Note.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

.Delete_Personal_Note

{

    background-image: url(../../images/DeletePersonalNote.gif);

    background-position: center !important;

    background-repeat: no-repeat !important;

}

[Rumen]

Hi John,

You can see how to set custom icons to the context menus in this forum thread: custom contextmenu icon.

If you need further help, please send your custom icons so that I can prepare a test project.


Best regards,
Rumen
the Telerik team

[John]

gif's attatched

[Rumen]

Hi John,

Here is how to modify the classes:

   <style type="text/css">
       /*
* Editor Tool Bar
*/
       .reTool .Edit_Personal_Note
       {
           background-image: url(images/Edit_Personal_Note.gif);
           background-position: center !important;
           background-repeat: no-repeat !important;
       }
       .reTool .Delete_Personal_Note
       {
           background-image: url(images/DeletePersonalNote.gif);
           background-position: center !important;
           background-repeat: no-repeat !important;
       }
       /*
* Context Menu Tool bar (Note that path is same as for toolbar above and the toolbar works
*/
       .Edit_Personal_Note
       {
           background-image: url(images/Edit_Personal_Note.gif) !important;
       }
       .Delete_Personal_Note
       {
           background-image: url(images/DeletePersonalNote.gif) !important;
       }
   </style>

For your convenience I have attached my test project.

Greetings,
Rumen
the Telerik team

[John]

Thanks!  Files were helpful.  My error was including the lines;

           background-position: center!important;

           background-repeat: no-repeat!important;

and not including "!important" in the url reference for the context menus.

Thanks again.