Font in dropdown is different from menu?!

[Rene]

I'm building a new version of my website and I've noticed this:



The dropdown items seem to be another font than the main menu. I want them to be the same (like the main menu that is).

The menu_data.js code:

Code: Select all

fixMozillaZIndex=true; //Fixes Z-Index problem  

with Mozilla browsers but causes odd scrolling 

problem, toggle to see if it helps
_menuCloseDelay=300;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;

with(menuStyle=new mm_style()){
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
itemwidth=125;
fontfamily="Arial";
fontsize="8pt";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#000000";
onbgcolor="#DCE9F0";
oncolor="#FF0000";
outfilter="Fade(duration=0.3)";
overfilter="Fade(duration=0.0);Alpha(opacity=90)";
padding=5;
pagebgcolor="#DCE9F0";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="http://img.milonic.com/arrow.gif";
subimagepadding=2;
}

with(milonic=new menuname("History")){
overflow="scroll";
style=menuStyle;
aI("text=GT-Four history;url=gtfourhistory.htm;")
aI("text=ST185 models;url=st185models.htm;")
aI("text=TTE;url=tte.htm;")
aI("text=Carlos Sainz;url=carlossainz.htm;")
}

Etc.

I've searched on here and tried to insert (in the menu_data.js file) this:

Code: Select all

subStyle=new copyOf(menuStyle);
subStyle.fontfamily="Arial";
subStyle.fontstyle="normal"; 
subStyle.fontsize="8pt";

And also just the first and last line of those 4. It doesn't work, the dropdown still isn't the same font.
I've also tried inserting all 4 or just the 2 lines in the webpage itself (in the menu code) - also doesn't work.

How can I get my dropdown font smaller - or more narrow by the looks of it?

[Ruth]

Hi,

I need to have the page url, if possible, if not I need to have you post all the page html coding, the css coding, and the full data file so I can make a page and test it. There are many things that might cause that problem and without having an actual page with all the related coding I can't narrow it down. I also need to know the menu version you are using. There were font issues that were corrected over time, so if you have an old version, there may be nothing to be done. You need to have the newest version.
Ruth

[Rene]

Hi Ruth,

I've uploaded a test page: http://www.turbocelica.nl/test/

The menu version I'm using is 5.813

[Ruth]

Hi,

Well, I can't see any difference. I do see the difference in your screen capture but I'm not seeing that in IE6, FF2.0.020, FF 3.01, NN7, NN9, or Opera. I do see a difference in Safari 3 for pc, but what I'm seeing in Safari is what looks like bold text in all menus, main and subs, but the others just look like regular/normal font.

As a test, try adding fontweight="normal"; in your data file, if it is normal you want, or fontweight="bold"; if you want bold and see if that makes them the same in your browser. What browser does this?

Ruth

[Rene]

I've added the fontweight line (below fontstyle in the 'menustyle' block of lines) and it doesn't work, I still have a different looking font in the subs.
What I'm after is the font that's in the main menu in my screen cap. I want the subs to be more narrow (subs already look like Arial, but somehow wider?!)

I'm using IE7.

[Ruth]

Unfortunately, I can't test it since I don't get the problem. I see in your image that it looks as if the font is bold in the main menu and not bold in the submenu, but I do see that at all in any browser I tried, except safari which shows it as looking bold in all menus.

I can only make suggestions. You could try setting up the fonts in css and use the offclass and onclass in the style. So create a class in the head of the document, or if you have a css style sheet in the style sheet like below. using whatever properties you want for the fonts. You also need to put in the text decoration because if it isn't there, some browsers underline by default, it seems, if you use css in the menu.

Code: Select all

.myfont{font-family:arial;font-size:8pt;font-style:normal;font-weight:normal; text-decoration:none}

Then in the menu data file, under the menuStyle, take out the font stuff and add

offclass="myfont";
onclass="myfont";

See if that fixes whatever problem you are having in IE7. It's the only thing I can think to try. I'll post to Milonic and see if they can go to that link in IE7 and if they see what you see.

Ruth

[Rene]

I've added a CSS sheet -

In the head of the html I've added:

Code: Select all

<link rel="stylesheet" type="text/css" href="fonts.css" />

fonts.css is:

Code: Select all

.myfont{font-family:arial;font-size:8pt;font-style:normal;font-weight:normal; text-decoration:none}

And in the menu_data.js I've replaced:

Code: Select all

fontfamily="Arial";
fontsize="8pt";
fontstyle="normal";

With:

Code: Select all

offclass="myfont";
onclass="myfont";

.. And I still see the difference.

[Ruth]

Hi,

OK, well I posted this to Milonic and gave the link to this post and to your test page. I'm sure someone there has IE7.

Ruth

[John]

Looking at your page in IE7 here I see no difference between the main and the subs.