CSS/DHTML Menu

admin

Administrator
Staff member
I am banging my head against the wall with this one. I have a DHTML menu that is formatted using CSS. With Internet Explorer, it looks perfect (well, almost perfect). With Firefox/Netscape, the main menubar doesn't "line-up" correctly. I'm assuming this is a CSS issue. Any help would be much appreciated! Please see the attached pictures (and if you need the full CSS source, please let me know, but all the relevant information should be below).

.MenuBarContainer
{
left: 0px;
top: 0px;
width: expression(constExpression(Browser_Info.isIE ? "100%": "auto"));
height: 23px;
border: 0px;
z-index: 5000;
text-align: left;
}

/* Menu Bar IFrame Related */
.MenuBarContainerIFrame
{
border: 0px;
z-index: 4999;
left: -500px;
top: -500px;
z-index: 4999;
}

/* Menu Bar Related */
.MenuBarTable
{
background-color: #A6C4f6;
background-image: url(/intranet/_common/scripts/application_menu/themes/office_2003/office_2003_menubar_background23.gif);
background-position: left;
background-repeat: repeat-x;
cursor: default;
height: 23px;
}

.MenuBarRow
{
margin-top: 2px;
margin-bottom: 20px;
}

/* Menu Bar Title Related */
.MenuBarTitle
{
display: inline;
text-align: right;
padding-top: 2px;
padding-right: 5px;
width = expression(constExpression(Browser_Info.isIE ? "100%": "auto"));

}

.MenuBarTitleHTML
{
color: #800000;
display: block;
font-variant: small-caps;
font-family: Tahoma, "MS Sans Serif" , Arial, Helvetica;
font-size: 10pt;
white-space: nowrap;
vertical-align: middle;
cursor: default;
height: 10px;
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=1, Color= "#FFFFFF" , Positive= "true" );
}

/* Menu Drag Div Related */
.MenuBarDragDiv
{
background-image: url(/intranet/_common/scripts/application_menu/themes/office_2003/office_2003_menubar_dragdiv.gif);
background-position: center;
background-repeat: no-repeat; /* cursor: move; */
display: inline;
font-family: "MS Sans Serif" , Tahoma, Helvetica, Arial;
font-size: 10px;
padding-left: 2px;
padding-right: 2px;
width: 8px;
vertical-align: middle;
}

/* Menu Bar Item Related */
.MenuBarItem
{
background-image: none;
color: #000000;
font-family: "MS Sans Serif" , Tahoma, Helvetica, Arial;
font-size: 8px;
padding-left: 10px;
padding-right: 10px;
white-space: nowrap;
}

.MenuBarItemOver
{
background-image: url(/intranet/_common/scripts/application_menu/themes/office_2003/office_2003_menubar_button_over.gif);
background-repeat: repeat-x;
border: 1px solid #002D96;
font-family: "MS Sans Serif" , Tahoma, Helvetica, Arial;
font-size: 8px;
padding-left: 9px;
padding-right: 9px;
}

.MenuBarItemHTML
{
padding-top: 2px;
padidng-bottom: 2px;
}

.MenuBarItemClick
{
background-image: url(/intranet/_common/scripts/application_menu/themes/office_2003/office_2003_menubar_button_clicked.gif);
background-repeat: repeat-x;
border: 1px solid #002D96;
font-family: "MS Sans Serif" , Tahoma, Helvetica, Arial;
font-size: 8px;
padding-left: 9px;
padding-right: 9px;
white-space: nowrap;
}

Thanks!

ChadCSS is closely tied to the HTML. Both are required to find the solution to the problem.
 
Back
Top