Submenu alignment in IE

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:15

Submenu alignment in IE

Poster: mqcarpenter
Dated: Tuesday February 7 2006 - 20:44:06 GMT

I have looked at a few suggestions on the board and do not like what I see on the submenu alignment problem I have. I need to maintain the DIV structure and do not want to use tables if possible. My CSS needs cleanup but could someone give me an idea on the subs for this menu in IE? Thank you

http://www.returnofthechampions.com

Poster: mqcarpenter
Dated: Tuesday February 7 2006 - 21:59:25 GMT

I will note that I removed ALL settings in my JS file and am controlling the menu strictly through CSS. This is the information related to the menu behavior:

Code:

.menuOff7 { margin: 0 0 0 15px; color: #594737; padding-bottom: 3px; font-size: 16px; font-family: Georgia, "New Century Schoolbook"; font-weight: bold; text-decoration: none;} 
.menuOn7 { margin: 0 0 0 15px; color: #594737; padding-bottom: 3px; font-size: 16px; font-family: Georgia, "New Century Schoolbook"; font-weight: bold; background: url(/img/_under01.gif) repeat-x 100% 100%;      }
.menuOff7a { margin: 0 0 0 5px; color: #594737; padding-bottom: 3px; font-size: 11px; font-weight: bold; text-decoration: none; background: url(/img/submenu01.gif) repeat-x 100% 100%; } 
.menuOn7a { margin: 0 0 0 5px; color: #594737; padding-bottom: 3px; font-size: 11px; font-weight: bold; text-decoration: none; background: url(/img/submenu02.gif) repeat-x 100% 100%; }

Poster: Migru
Dated: Tuesday February 7 2006 - 22:07:28 GMT

Hi

did you check if you could take the menu out from the div and position it absolute using top= : and left= ; ??

Michael

Poster: mqcarpenter
Dated: Tuesday February 7 2006 - 23:07:26 GMT

Migru wrote:

Hi

did you check if you could take the menu out from the div and position it absolute using top= : and left= ; ??

Michael

Where does that position information go?

Poster: mqcarpenter
Dated: Tuesday February 7 2006 - 23:13:26 GMT

I put this in the main menu reference and it did not resolve the submenu position, but moved the main menu to the top of the window:

Code:

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=-4;
_subOffsetLeft=-6;

with(menuStyle7=new mm_style()){
offclass="menuOff7";
onclass="menuOn7";
}

with(menuStyle7a=new mm_style()){
offclass="menuOff7a";
onclass="menuOn7a";
fontsize="100%";
}

with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="horizontal";
top=0;
left=0;
style=menuStyle7;
aI("status=Back To Home Page;text=home;url=http://www.milonic.com/;");
aI("text=home;url=/;");
aI("showmenu=league;text=league;");
aI("showmenu=teams;text=franchises;");
aI("showmenu=leaguestats;text=league stats;");
aI("text=player stats;url=/stat_players.php");
aI("showmenu=manage;text=manage;");
aI("text=smack;url=/f0rum");
}

Poster: Migru
Dated: Wednesday February 8 2006 - 1:16:01 GMT

Hi

no, what I meant was, try as follows:

take the menu out from the div and place the code next to the <body> tag :

Code:

<body>
script type="text/javascript" src="milonic_src.js"></script>   
<script type="text/javascript">
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=mmenuns4.js><\/scr"+"ipt>");      
  else _d.write("<scr"+"ipt type=text/javascript src=mmenudom.js><\/scr"+"ipt>"); 
</script>
<script type="text/javascript" src="menu_data.js"></script>

In the main menu, replace top=0; with top=150; and add screenposition="center";
(I´ve not checked if 150 is ok, but I just estimated "150".)

An alternative method is to use relative positioning, though it is recommended for the use in tables, I´ve never tested that with divs.
It is explained here

http://www.milonic.com/menusample9.php

It might work with divs too, but might create problems when used in different browsers.

Michael

Poster: mqcarpenter
Dated: Thursday February 9 2006 - 14:07:44 GMT

It is not where I wanted it, but I moved the menu to the top and used that technique and it is working. THank you for the help!

Poster: Ruth
Dated: Thursday February 9 2006 - 14:12:41 GMT

Hi,

One other thing that you can try, which many have used who want to use divs and have a similar layout, is to set the top part as a table which includes the menu, and then start the divs below that.

Ruth

Industrial Strength JavaScript and DHTML Menus

Submenu alignment in IE