Menu busting out of table cell ONLY in IE7? [solved]

[drdavidge]

Hey guys.. any idea why the menu is stretching beyond the table cell on this page, but only in IE7? Works fine in firefox and IE6.

http://severud.nj-webdesigner.com/recog ... ition.html

[drdavidge]

Anyone? Been struggling with this for a few days and still can't figure it out.

[Ruth]

Hi,

I don't have IE 7 but I was checking and don't see anything to cause that to happen. Usually it's something in css.

However, I'll give you a few suggestions to see if it fixes the issue.

First, as a side note, margin is not a style property by itself, so if you're trying to set the margins to 0 you have to do it in each menu also, but I believe 0 is the default, not sure on that. Though this should have nothing to do with the problem.

Now, try setting a menuwidth in the main menu, menuwidth=592, which is what the images equal. If the menu width by itself doesn't work add an item width to each item. Your in cell data file would be

Code: Select all

with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="horizontal";
position="relative";
style=menuStyle;
margin=0;
padding=0;
menuwidth=592;
//aI("text=Home;url=index.html;");
aI("image=nav_firm.jpg;overimage=nav_firm_over.jpg;showmenu=Firm;url=../firm/firm.html;itemwidth=88;");
aI("image=nav_projects.jpg;overimage=nav_projects_over.jpg;showmenu=Projects;url=../projects/projects.html;itemwidth=121;");
aI("image=nav_recognition.jpg;overimage=nav_recognition_over.jpg;showmenu=Recognition;url=../recognition/recognition.html;itemwidth=150;");
aI("image=nav_careers.jpg;overimage=nav_careers_over.jpg;showmenu=Careers;url=../careers/careers.html;itemwidth=119;");
aI("image=nav_contact.jpg;overimage=nav_contact_over.jpg;showmenu=Contact;url=../contact/contact.html;itemwidth=114;");
}
drawMenus();

That's all I can suggest since I don't have IE7 to test.

Ruth

[drdavidge]

Hi, thanks for the suggestions. I tried making those changes but it is still not working. Here's the URL with the changes you suggested:

http://severud.nj-webdesigner.com/test/ ... ition.html

Any other suggestions? This is driving me crazy..haha.

[drdavidge]

Finally figured it out... I commented out..

/*
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
*/

and it works no problem now. Looks like the shadow effect was creating a drop shadow effect, ultimately taking up more space than the 592px width. All good now.. thanks!

[Ruth]

Hi,

If you like parts of that code you can just eliminate the shadow. For example the alpha opacity or the fade or you can test the demo to see if there are any other particular transitions or filters you would like. Of course these will only apply in IE since they are proprietary to Internet Explorer. This is an interactive demo which allows you to apply the different filters or transitions to the menus on the page to see the results. Static Filters includes the shadow and the alpha filter.

http://support.milonic.com/demos/filters/index.htm

Ruth