Remove/Change fixed column count for Collections menu item (buddha mega menu)

[JWhincup]

Hi there,

I am having an issue finding where I can customise the amount of columns of an individual submenu on our menu. We are using Buddha Mega Menu for this, which has limited UI options so believe it must be in the liquid files. All of our other menus distribute the blocks onto one row, but due to there being a maximum of two columns in the Collections submenu it has two rows and looks inconsistent with the rest of the menu.

I would like to locate, and change the script that is forcing this to happen, or make a new script to overwrite this.

As I have investigated this issue, I have found that the Buddha Mega Menu FAQ states that the menu inherits it's settings from the header... Unsure if this helps though.

LINK TO SITE 

This is the menu item that is problematic.

Other menu items are aligned from the start and make use of one row

[suyash1 · Accepted solution]

@JWhincup - please add this given css to the very end of your styles.css file and check, adjust number 25 as per the need

@media screen and (min-width:1050px){
ul.mm-submenu.simple[columns="2"] li[submenu-columns="1"]{width: 25%!important;}
}

[suyash1 · Accepted solution]

@JWhincup - please add this given css to the very end of your styles.css file and check, adjust number 25 as per the need

@media screen and (min-width:1050px){
ul.mm-submenu.simple[columns="2"] li[submenu-columns="1"]{width: 25%!important;}
}

[JWhincup]

Thank you for your prompt reply.

I have copied this into the style.css but unfortunately this doesn't work. I think the value we have changed here is replaced by the inheritance of the buddha-menu-item class, submenu-columns value (which is also 2).

[suyash1 · Accepted solution]

@JWhincup - replace it with this css and try

@media screen and (min-width:1050px){
#nav ul.mm-submenu.simple[columns="2"] li[submenu-columns="1"]{width: 25%!important;}
}

[JWhincup]

Thank you so much! I'm surprised it is possible to fix this through the styles.css sheet, is this more of a quick-fix? Is there any way to make this change inside of the buddha megamenu liquid file?

[suyash1]

@JWhincup - this is css fix and hence it is quick, even mega menu too uses css only to set number of columns, so no need to change in megamenu liquid file

[siguy85]

Hey,

Would you be able to assist me with finding the correct place to update for my theme, I want to move the columns so they are more spaced out like this:

link to the site here https://www.duvetday.co.uk/

Thanks in advance!