Need multiple columns in DD Smoothmenu v2 and BUG!

Hi all, I just started an online business selling stock media, similar to the Pond5 and Video Hive web sites. My developers set me up with a Joomla-based site and installed the DD Smoothmenu v2 (from the Dynamic Drive people). I am not with those developers right now and I need to make a couple of changes. First, I added a bunch of new categories in the dropdown, but each one is single column and I’m looking in the “ddsmoothmenu-v.css” file to make the changes, but the code confuses me with the “li” and “ul” elements. The developers may have also did some additional integration in some other CSS files, but I included the two major ones in a ZIP file here:

This could be a super easy solution for a CSS expert…I just need to know how to make the drop downs with more than 20 items to be double or triple columns in the Smoothmenu drop down.

Also, whenever I shrink or restore any of the three major browsers, or if I go fullscreen on a preview video on the web site, the drop down goes CRAZY (lol). All categories automatically drop down and I’m forced to rollover them to make them go back to normal. Trust me, you’ll see the bug. SO annoying! My developers would not touch it without requiring more money (which made me a little but angry), so I’m left to try to tackle this issue myself.

I also do not wish to reveal my web site on the thread, but I can give you some fun hints to find it. The web site name is two words put together. The first word means movement and rhymes with lotion. The second word is 3 letters long, begins with the letter “A,” and is often the most important card in a card player’s deck. I appreciate your confidentiality about my web site, thanks!


Turning a dropdown into multiple columns for more than 20 items would require quite a bit of javascript and be pretty awkward to do.

Regarding your menus showing on resize then you can try this following fix which should be added at the end of the css file.

.ddsmoothmenu-v ul li ul{display:none!important}
.ddsmoothmenu-v ul li:hover > ul{display:block!important}

@media screen and (max-width:786px){
.ddsmoothmenu-v > ul > li{color:#fff}
.ddsmoothmenu-v > ul > li li {color:#000}