Menu 2 Columns?

Hi raizaduran. Yes, your custom CSS would go in your child theme style.css file. Those posts and links describe a number of different options. Please describe what exactly you’re trying to do and also post a link to your site. Thanks.

@bdbrown: here is my site indiavirtualinfo. com

If you see at the top bar, it has a dropdown menu named “Explore India” with different categories (in a row)

I want to show it in 3 columns, since the dropdown list is long.

All of the above links somewhere say the solution of it, but none of it worked for me ??

Any help please.

The answer is in the second post I linked. Those are the basic steps but you need to modify the CSS for 3 columns. Add the class to the menu item as indicated in the post. I simplified the CSS so, rather than counting columns, it’s based on element widths. If you add a submenu item longer than “Outdoor & Adventure” you’ll need to modify the <ul> and <li> widths:

/* set submenu container width */
.sub-menu-columns ul.sub-menu {
    width: 510px;
}
/* submenu items in 3 columns */
.sub-menu-columns ul.sub-menu li {
    display: inline-block;
    float: left;
    width: 160px;
    margin-right: 10px;
}

Dear bdbrown, thanks for the help. but unfortunately it didn’t work yet.

I’ve added the suggested code in style.css file placed in this directory: /public_html/wp-content/themes/hueman_main_child

and added sub-menu-columns in menu option. see the screenshot.

https://www.dropbox.com/s/xnfgs9lhcvifp7s/screenshot.PNG?dl=0

Am I missing something? Appreciate your help.

I just checked your site. Looks like it’s working now.

oh wow! yes yes. it’s working. fantastic.

Thanks a lot bdbrown ??

Glad to hear it’s working. Please mark the topic as Resolved. Thanks.