Quick CSS fix (needs to be set per site - not a one size fits all)

HI pjbarry21,
the actual code of the megamenu is designed to work with a 3-level hierarchy with a maxiumum of four 2nd-level items.
we are working to make it more flexible.

Having the same issue. I only have 2nd level menu items as well.

Can you post a fix it?

Thanks!

The class I changed to get this to work was .mega. I'm not sure which css file it's in because I'm using the sweaver to edit my themes.

However, I think the theme needs to not make a separate column for level 2 menu items without children.

Sorry, I think I misread the initial issue.

My problem is that I've got a bunch of l2 items with no l3 items. What's happening with me is that I'm getting a single column of my l2 items and the mega menu is stretching out like I've got 6 columns when all I really wanted was a single column of l2 items. I resolved this by created a DISABLED l2 item, and setting the links I wanted to be children of that.

EDIT: When I did this it exposed a bug in IE8 where the 3rd lvl UL element was being added directly to the parent UL without an LI. Chrome, Firefox, and IE7 (oddly enough) were smart enough to figure it out but ie8 flipped out and started displaying mega menu items at the page level, totally breaking the page. To fix this I added:

            else {
              $output .= '<li>';
            }

at line 186 of theme.inc such that it adds an unstyled LI tag if as the parent if the L2 menu is disabled.

I have almost six sections under one main menu item, and each sections have 8 sub menu items, and the megamenu renders it alright (the basic science menu of 1st picture) but it renders the other one in a single column, no matter what (clinical science menu of 2nd picture). Even when i made the "megamenuwrapper overflow" fixed (changed "auto" to "400px"), the width doesn't increase. I can't make it work. Any suggestions??

This is how i made it work: Each primary item has a unique id assigned to it. So, if you want to attack a particular sub-container (or sub-menu, whatever) you have to style starting with that primary menu id.
In the screenshot that i have attached above, the "clinical science" primary link, has the id of "menu-main-title-778" (You can use firebug to inspect the menu id). The css for the primary navigation is in the primary-links.css. So, i made the following changes in the primary-links.css:

#menu-main-title-778 .mega { /*this is the id of the primary menu item which triggers the sub-container*/
	width: 750px;/*specify your width*/
}

And now only the sub-container of clinical science is 750px wide!!

Hi there

I've fixed my mega menu using a CSS amend. Please note you'll need to tailor the CSS to your particular requirements - It's by no means a one size fits all. But it stopped me from pulling my hair out before a more robust fix is in place :)

I had the problem whereby adding any more than 3 primary links (with sub-links) caused my mega menu to be one long line of links one after the other. It was ugly and impossible to scroll all the way to the bottom. So I made the following CSS changes:

primary-links.CSS

.megamenuWrapper{
overflow:auto;
padding:15px;
width:600px; /* Set a width for the overall menu when expanded */
height:300px; /* Set a height for the overall menu when expanded */
}

.menu-section{
float:left;
height:150px; /* Set a height for each individual primary link container (this contains the primary link and it's related secondary links) */
width:200px; /* Set a width for each individual primary link container */
}

Playing about with the heights and widths above has (on my drupal install) fixed the mega menu as you'll see in the attached. Just makes sure that the .megamenuWrapper width and height are divisable by the .menu-section width and height you set (otherwise it might not fit).

Hope that helps

Pete

Hello,

I am new to Drupal and have installed and would like to use the Megamenu but it is not working correctly. I have searched and everyone seems to want the opposite that I need! I need the menu to create columns because I have several 2nd level items with several 3rd level items under them. Here is my structure in the Main Menu links manager:

Top Level
---Second Level Item
-----Third Level Item
-----Third Level Item
-----Third Level Item
---Second Level Item
-----Third Level Item
-----Third Level Item
-----Third Level Item
---Etc...

No matter what I do, the menu will not put the links into columns. It stays really narrow and puts links that have two words or more onto multiple lines (see picture). If anyone can help me I would be greatly appreciative.

Hi tried editing the primary-links.css in the .mega section also with :

white-space:nowrap;
	width:auto;

And all it did was allow six 2nd-level items. If I add any more than 6, the panel turns into a long skinny column and doesn't display properly. Any other suggestions please.