Nav moves everything down

[DAVIDatc]

Edit: Fixed original problem, new problem.
Edit2: Fixed again, Sorry!

1) Script Title: ddsmoothmenu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm


3) Describe problem: My sub menus on the 2nd right-most of my nav gets cut off in all browsers

The website with the problem is www.karatemanitoba.ca/wp under Programs > Resources on the nav bar, might have to zoom out if the nav goes to the left

[ddadmin]

Please post a link to the page on your site that contains the problematic script so we can check it out.

[DAVIDatc]

www.karatemanitoba.ca/wp
it happens on every page on the nav that says Programs > Resources on the navbar
I believe the problem is that the nav is trying to go right because theres enough room there, but the div is cutting it off. When i zoom in the nav goes to the left instead

[ddadmin]

Is there supposed to be an additional sub menu when you hover over "resources" under "program"? Looking at your page's source I don't see a 3rd tier menu, and hence don't see any sub menu being cut off, at least not in FF 13. A couple of issues I do see though:

1) In IE9, the menu doesn't run. This is because of a JS error in another one of your scripts on the same page. When IE runs into an error, it halts the execution of all remaining scripts on the page. The error IE complains of is:

// JavaScript Document
$m = jQuery.noConflict();
$m(document).ready(function(){
	$m(".ccf-datepicker").datepicker();
});

SCRIPT438: Object doesn't support property or method 'datepicker' 
custom-contact-forms-datepicker.js?ver=3.3.2, line 4 character 2

SCRIPT438: Object doesn't support property or method 'datepicker' 
custom-contact-forms-datepicker.js?ver=3.3.2, line 4 character 2

You'll want to either remove the code above from your page, or fix the underlining issue causing the error.

2) Certain required CSS selectors inside the default css file of the menu is missing from your page, namely:

/* ######### CSS for shadow added to sub menus  ######### */

.ddshadow{ /*shadow for NON CSS3 capable browsers*/
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
background: silver;
}

.toplevelshadow{ /*shadow opacity for NON CSS3 capable browsers. Doesn't work in IE*/
opacity: 0.8;
}

You'll want to add this back to the CSS file of your menu, as the script uses the above to properly render the shadow of the menu in certain browsers.