I have implemented a RadMenu system and noticed that the first and last menu item does not have any of the styling like the other menu items in between from this CSS:
.RadMenu_Default .rmRootGroup,
.RadMenu_Default a.rmLink,
.RadMenu_Default .rmGroup .rmText,
.RadMenu_Default .rmVertical .rmText,
.RadMenu_Default .rmLeftArrow,
.RadMenu_Default .rmRightArrow,
.RadMenu_Default .rmTopArrow,
.RadMenu_Default .rmBottomArrow
{
background-image: url('../Images/rmSprite.png');
background-color: transparent;
}
.RadMenu_Default .rmRootGroup
{
background: #0072C6 !important; /* Old browsers */
background: linear-gradient(to bottom, #0072C6 0%,#8eb92a 50%,#72aa00 51%,#003A66 100%) !important; /* W3C */
background-image: -ms-linear-gradient(bottom, #003A66 0%, #0072C6 100%) !important; /* IE 10 */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0072C6', endColorstr='#003A66',GradientType=0 ) !important; /* IE6-9 */
color: White !important;
}
.RadMenu_Default .rmGroup, .RadMenu_Default .rmMultiColumn, .RadMenu_Default .rmGroup .rmVertical
{
background: #0072C6 !important;
color: White !important;
}
.RadMenu_Default .rmHorizontal .rmRootLink span.rmText:hover
{
background: #0072C6 !important;
color: White !important;
}
.RadMenu_Default a.rmExpanded, .RadMenu_Default a.rmExpanded:hover
{
background: #0072C6 !important;
color: White !important;
}
.RadMenu_Default .rmItem .rmFirst .rmLink .rmText:hover, .RadMenu_Default .rmItem .rmLast .rmLink .rmText:hover
{
background: #0072C6 !important;
color: White !important;
background-image: none !important;
}
.rmText
{
color : White;
}
I am wondering if there is a way to make the styling for the first and last menu item the same as what is being rendered/styled for the other menu items?