Forums (Obsolete)


Member	kamran - 9/29/2006 7:15:58 AM border CMSMenu How can one get rid of the border of cmsmenu. I have tried setting the border-width to 0 as well as the border color but still it shows the border. This is a big problem, when using images as background, which result in spacing between the menu items. Could you please tell me a solution to it.

Member

Bipul Dobhal - 9/29/2006 12:05:46 PM

Re: border CMSMenu

Hi,

set border=0 in all cmsmenu classes ( cmsmenu, cmsmenuitem etc ) or you can define ur own cmsClasses in similar manner just like

/*Start of CSS for first level of menu items of Top menu*/
.CMSMenu
{

BORDER-RIGHT: 0px;
BORDER-TOP: 0px;
BORDER-LEFT: 0px;
BORDER-BOTTOM: 0px;
text-decoration:none;
PADDING-BOTTOM: 0px;
PADDING-TOP: 0px;
padding:0;
CURSOR: hand;

}
.MainMenuCMSMenu
{
height:22px;
}
.MainMenuCMSMenuItem
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color:#293d6b;
height:10px;
}
.MainMenuCMSMenuItemMouseUp
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color:#293d6b;
}
.MainMenuCMSMenuItemMouseOver
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color: #94283A;
}
.MainMenuCMSMenuItemMouseDown
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color:#293d6b;
}
.MainMenuCMSMenuHighlightedMenuItem
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color:#94283A;
}
.MainMenuCMSMenuHighlightedMenuItemMouseUp
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color: #94283A;
}
.MainMenuCMSMenuHighlightedMenuItemMouseOver
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color: #94283A;
}
.MainMenuCMSMenuHighlightedMenuItemMouseDown
{
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
border-right-style:solid;
border-right-width:1px;
border-color:#AEAEAE;
font-family: Verdana;
font-size:10px;
font-weight:bold;
color:#94283A;
}
/*End of CSS for first level of menu items of Top menu*/

and if you want to set different style in its sublevels then you can add more class for its sub levels like:

/*Start of CSS for second level of menu items of Top menu*/
.MainMenuSubMenuCMSMenu
{

}
.MainMenuSubMenuCMSMenuItem
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuItemMouseUp
{
background-color:#D5D5D5;
color:#94283A;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuItemMouseOver
{
background-color:#D5D5D5;
color:#94283A;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuItemMouseDown
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuHighlightedMenuItem
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuHighlightedMenuItemMouseUp
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuHighlightedMenuItemMouseOver
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}
.MainMenuSubMenuCMSMenuHighlightedMenuItemMouseDown
{
background-color:#D5D5D5;
color:#293d6b;
font-family: Verdana;
font-size:10px;
font-weight:bold;
width:120px;
PADDING-LEFT: 10px;
}

/*End of CSS for Second level of menu items of Top menu*/

and similarly in other levels..

Now set the property "cssPrefix" of the CmsMenu accordingly like "MainMenu;MainMenuSubMenu;MainMenuOtherLevels"

You can refer to the PDF file or developers guide in detail..

I think this will help you..

Thanks,
Bipul Dobhal


Member	kamran - 10/3/2006 2:05:27 AM Re: border CMSMenu thanks..i actually set itemspacing property of the cmsmenu to zero, which solved the problem.