menuheight: Different height depending on browser

[auroraes]

Hello it seems that the menuheight property is not consistant between browsers. For example, I entered a menuheight of 182 (menuheight=182;) for a submenu, but in Firefox 1.0.6 the menu height is actually 174 and the menu height in IE is 184. Neither what I had actually specified. For what I'm doing I need the menuheight to be near exact for each browser.

Here's my menu style for the submenu...

Code: Select all

with(menuStyle=new mm_style()){
imagepadding=0;
separatorsize=10;
offbgcolor="#FF00FF";
onbgcolor="#FF00FF";
overfilter="Alpha(opacity=90)";

}

Here's my submenu code...

Code: Select all

with(milonic=new menuname("profile")){
style=menuStyle;
overflow="scroll";
left=181;
menuheight=182;
top=41;
aI("image=/images/sl-cp-overview.gif;url=/cgi-bin/landing.cgi?ref=profile;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-cp-philosophy.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-cp-profiles.gif;url=#;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-cp-history.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-cp-company.gif;url=#;imagewidth=93;imageheight=20;title=");
aI("image=/images/sl-cp-international.gif;url=#;imagewidth=93;imageheight=18;title=");
aI("image=/images/sl-cp-lan.gif;url=#;imagewidth=93;imageheight=20;title=");
}

And here is the menu in both browsers (Firefox on the left, IE on the right) - Nasty color used to show the menu background.



Any help to make these the same height is much appriciated.

Thanks!
Matt

[Ruth]

Hi Matt,

Is there anyway you can put up a test page so we can see your css, htm, and full menu coding? There are a lot of things that could be causing that problem and without all that info it's really hard to narrow the problem.

Ruth

[Ruth]

Hi Matt,

I can give you a negative. It is not the stylesheet as far as I can tell since I removed it and the problem persisted.

There is nothing I can find that is causing it. I've reported it.

Ruth

[auroraes]

Thanks! I appriciate your help with this.

Matt

[John]

While I'm pretty sure the menu should default to this, try...

Code: Select all

menuheight="182px";

[auroraes]

Hi John,

That appears to actually break the menu making the submenu a very tiny scrollable area breaking the width as well (maybe around a 20px X 20px square). menuheight seems to want to expect a number instead of a string.

Thanks!
Matt

[John]

Oh, well - my one idea of the day, down the drain...

[Andy]

Is there any CSS on the page that could be causing this.

Just checked it and when I set a menuheight to a menu, it does appear the same in both browsers.

-- Andy

[auroraes]

I stripped out all other css, and still get a 10 pixel difference between the browsers. I set menuheight for each menu to 184, and get a height of 186 in IE and a height of 176 in FireFox.

Here's the menu_data, maybe I'm not using something in it correctly?

Code: Select all

_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=0;

// Added function to get query string to determine
// which section we are on.
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  } 
}
var ref = getQueryVariable("ref")



with(mainmenuStyle=new mm_style()){
imagepadding=0;
separatorsize=7;
}

with(menuStyle=new mm_style()){
imagepadding=1;
separatorsize=9;
offbgcolor="#FF00FF";
onbgcolor="#FF00FF";
overfilter="Alpha(opacity=85)";

}

with(milonic=new menuname("Main Menu")){
style=mainmenuStyle;
alwaysvisible=1;
left=52;
orientation="vertical";
top=41;
if (ref == "profile") {
aI("image=/images/ml-profile-on.gif;url=/cgi-bin/landing.cgi?ref=profile;showmenu=profile;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-profile-off.gif;overimage=/images/ml-profile-on.gif;url=/cgi-bin/landing.cgi?ref=profile;showmenu=profile;imagewidth=130;imageheight=11;title=;");
}

if (ref == "design") {
aI("image=/images/ml-design-on.gif;url=/cgi-bin/landing.cgi?ref=design;showmenu=design;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-design-off.gif;overimage=/images/ml-design-on.gif;url=/cgi-bin/landing.cgi?ref=design;showmenu=design;imagewidth=130;imageheight=11;title=;");
}
	
if (ref == "services") {
aI("image=/images/ml-services-on.gif;url=/cgi-bin/landing.cgi?ref=services;showmenu=services;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-services-off.gif;overimage=/images/ml-services-on.gif;url=/cgi-bin/landing.cgi?ref=services;showmenu=services;imagewidth=130;imageheight=11;title=;");
}
	
if (ref == "markets") {
aI("image=/images/ml-markets-on.gif;url=/cgi-bin/landing.cgi?ref=markets;showmenu=markets;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-markets-off.gif;overimage=/images/ml-markets-on.gif;url=/cgi-bin/landing.cgi?ref=markets;showmenu=markets;imagewidth=130;imageheight=11;title=;");
}

if (ref == "projects") {
aI("image=/images/ml-projects-on.gif;url=/cgi-bin/landing.cgi?ref=projects;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-projects-off.gif;overimage=/images/ml-projects-on.gif;url=/cgi-bin/landing.cgi?ref=projects;imagewidth=130;imageheight=11;title=;");
}

if (ref == "knowledge") {
aI("image=/images/ml-knowledge-on.gif;url=/cgi-bin/landing.cgi?ref=knowledge;showmenu=knowledge;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-knowledge-off.gif;overimage=/images/ml-knowledge-on.gif;url=/cgi-bin/landing.cgi?ref=knowledge;showmenu=knowledge;imagewidth=130;imageheight=11;title=;");
}

if (ref == "locations") {
aI("image=/images/ml-locations-on.gif;url=/cgi-bin/landing.cgi?ref=locations;showmenu=locations;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-locations-off.gif;overimage=/images/ml-locations-on.gif;url=/cgi-bin/landing.cgi?ref=locations;showmenu=locations;imagewidth=130;imageheight=11;title=;");
}

if (ref == "careers") {
aI("image=/images/ml-careers-on.gif;url=/cgi-bin/landing.cgi?ref=careers;showmenu=careers;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-careers-off.gif;overimage=/images/ml-careers-on.gif;url=/cgi-bin/landing.cgi?ref=careers;showmenu=careers;imagewidth=130;imageheight=11;title=;");
}


}

with(milonic=new menuname("profile")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
menuwidth=95;
top=41;
aI("image=/images/sl-cp-overview-mo.gif;url=/cgi-bin/profile.cgi?loc=overview;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-cp-philosophy-mo.gif;url=/cgi-bin/profile.cgi?loc=philosophy;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-cp-profiles-mo.gif;url=/cgi-bin/profile.cgi?loc=profiles;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-cp-history-mo.gif;url=/cgi-bin/profile.cgi?loc=history;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-cp-background-mo.gif;url=/cgi-bin/profile.cgi?loc=background;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-cp-international-mo.gif;url=/cgi-bin/profile.cgi?loc=international;imagewidth=93;imageheight=18;title=;");
aI("image=/images/sl-cp-lan-mo.gif;url=/cgi-bin/profile.cgi?loc=lan;imagewidth=93;imageheight=20;title=;");
}

with(milonic=new menuname("design")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-de-overview-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-de-design-mo.gif;url=#;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-de-leed-mo.gif;url=#;imagewidth=93;imageheight=8;title=;");
aI("image=/images/sl-de-awards-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("services")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-s-overview-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-planning-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-s-architecture-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-engineering-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-s-interiors-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-infrastructure-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("markets")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-m-aviation-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-corp-mo.gif;url=#;imagewidth=93;imageheight=17;title=;");
aI("image=/images/sl-m-gaming-mo.gif;url=#;imagewidth=93;imageheight=18;title=;");
aI("image=/images/sl-m-gov-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-health-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-edu-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-hospitality-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-interiors-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-lib-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-manu-mo.gif;url=#;imagewidth=93;imageheight=17;title=;");
aI("image=/images/sl-m-plan-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-culture-mo.gif;url=#;imagewidth=93;imageheight=29;title=;");
aI("image=/images/sl-m-religious-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-retail-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-tech-mo.gif;url=#;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-m-sports-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-international-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");

}

with(milonic=new menuname("knowledge")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-ki-leadership-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-ki-trends-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-ki-position-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-ki-case-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("locations")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-l-daly-mo.gif;url=#;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-l-international-mo.gif;url=#;imagewidth=93;imageheight=18;title=");
aI("image=/images/sl-l-lan-mo.gif;url=#;imagewidth=93;imageheight=20;title=");
}

with(milonic=new menuname("careers")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-c-culture-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-profiles-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-openings-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-university-mo.gif;url=#;imagewidth=93;imageheight=20;title=");
}

drawMenus();