Gap 'tween Menu and submenu with Opera 7

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

Gap 'tween Menu and submenu with Opera 7

Poster: squareman
Dated: Tuesday December 21 2004 - 23:41:30 GMT

In Opera 7.51, I am getting a gap between the menu and submenu (seems to work in all other supporter browser WIN and MAC). I cannot link to the developing code, but I can say that the call to the code is in the HEAD tags and here are the options called out in the menu_data.js:

Code:

_menuCloseDelay=500           // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150            // The time delay before menus open on mouse over
_subOffsetTop=0               // Sub menu top offset
_subOffsetLeft=0          // Sub menu left offset



with(menuStyle=new mm_style()){
onbgcolor="#A8A2CE";
oncolor="#ffffff";
offbgcolor="#6D61AC";
offcolor="#FFFFFF";
bordercolor="#FFFFFF";
borderstyle="solid";
borderwidth=1;
separatorcolor="#FFFFFF";
separatorsize="1";
padding=5;
fontsize="11px";
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="black";
pagebgcolor="#82B6D7";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="navmenu/arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=90);";
outfilter="Fade(duration=0.2);Alpha(opacity=90);";
}

with(menuTop=new mm_style()){
separatorsize="0";
overfilter="Fade(duration=0.2);Alpha(opacity=90);";
outfilter="Fade(duration=0.2);Alpha(opacity=90);";
}

with(milonic=new menuname("Main Menu")){
style=menuTop;
screenposition="top;center";
top="offset=76";
left="offset=101";
alwaysvisible=1;
orientation="horizontal";

Images are being used for the menu and menu rollover position for the main menu.

Poster: kevin3442
Dated: Wednesday December 22 2004 - 0:08:31 GMT

Can you please post all of your menu_data.hs file?

Kevin

Poster: squareman
Dated: Wednesday December 22 2004 - 0:25:46 GMT

No need to post the data file. Here's specifically where I'm running into problems. I've discovered that it's a conflict with my CSS file. Spefically, it's the margin rule of the following div with ID:

Code:

#theBigStage {
   text-align: left;
   padding: 0;
   margin: 15px auto;
   border: 10px solid #200d81;
   background-color: blue;
   color: black;
   width: 760px;         /* this and next two lines for buggy winIE/5x browsers */
   voice-family: "\"}\"";
    voice-family:inherit;
   width: 740px;         /* this is the right width for compliant browsers */
   } 
html>body #theBigStage { width: 740px; } /* play nice with certain versions of Opera */

Specifially, if I remove that one rule, it works fine. As soon as I add margin back in, I get the gap. For refernce, #theBigStage is the first div in my HTML and used to center the entire content. And, no, those commented and hacked rules do not affect the bugginess of the menus (tried removing those first). If it is only if I remove the one margin rule that everything is okay.

Industrial Strength JavaScript and DHTML Menus

Gap 'tween Menu and submenu with Opera 7