Separator not displayed in Vista

[Gavin]

Hi

When using a menu or context menu with the Vista skin, the separator is not displayed. Is this a bug in the skin or as designed. If the skin is designed to hide the separator, how can you change the skin to display the separator?

Thank you
Gavin

[Alex Gyoshev]

Hi Gavin,

Thank you for your notice. I adjusted the Vista skin to include styling for separators - it will be available in future builds of RadControls "Prometheus".

Here are the rules that style them:

.RadMenu_Vista .rmHorizontal .rmSeparator .rmText
{
    background: #e0e0e0;
    width: 1px;
    height: 18px;
    padding: 0;
    border-right: 1px solid #fff;
}

.RadMenu_Vista .rmVertical .rmSeparator .rmText
{
    border-top: 1px solid #fff;
    background: #e0e0e0;
    height: 1px;
    width: auto;
    margin-right: 6px;
}

.RadMenu_Vista .rmRootGroup .rmVertical .rmSeparator .rmText
{
    margin-left: 30px;
    margin-right: 0;
}

Your feedback will be highly appreciated. Let us know what you think.

Best wishes,
Alexander
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Gavin]

Hi

Thanks for the script. I tried adding the script to Skins\Vista\Menu.Vista.css in my application folder but it didn't make any difference to either a menu or context menu.

Is that the correct place for the script or is there something else I'm missing?

Thanks

[Alex Gyoshev]

Hello Gavin,

If you want to leave the style declarations in the CSS file and use it instead of the embedded ones, you should use the EnableEmbeddedSkins property of the RadMenu and set it to false. Afterwards, add a link to the CSS file in the head section of your aspx file using the following HTML:

<link rel="stylesheet" type="text/css" href="Skins/Vista/Menu.Vista.css" />

Please consider reading the help topic on "How skins work".

Kind regards,
Alexander
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Gavin]

Thanks

I got the menu to display the seperator bar. However in IE6 the seperator bar is displayed incorrectly with a height of 6px. In Firefox it is displayed correctly.

I've tried to change the height in the CSS but nothing seems to make a difference.

Any suggestions?

Thanks

[Alex Gyoshev]

Hello Gavin,

Thanks for the notice.
Please add the following styles and the problem should be gone:

.RadMenu_Vista .rmVertical .rmSeparator,
.RadMenu_Vista .rmVertical .rmSeparator .rmText {
   font-size: 0;
   line-height: 1px;
}

Greetings,
Alexander
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center