1.8 MegaMenu (width)

Dear Bricks Devs,

thx for the 1.8 update -->looks great.

I never was a fan of full-width Mega-Menu because they are sometimes just too much.
Until now I was using Jet-MegaMenu and there I always made MegaMenu Dropdowns who fit to the Content which is inside (custom width).
This seems to be a very graceful way of working with Dropdowns bigger than just a vertical List. Sometimes I just want two vertical Lists side by side inside the Dropdown without any much styling or images etc. ----> just a little bigger dropdown than a regular one (and maybe some social Icons or buttons too).
As I have seen from the video of the new 1.8 Beta this isn´t as straight forward as I would wish. I would wish for an option to freely set the width of the MEgaMenu Dropdown without the need to be restricted by parent-container/CSS Selector.

Please Bricks Devs give us custom width on every single menu dropdown.

THX for your time.

Only on the phone now. It’s possible if you copy/paste the parent container id into the meganenu width field.

What exactly is possible? The example in the documenation shows only how to limit the width to the container / site width. I simply want to give the content container in the dropdown a width and I don’t get how this should work in the moment. Tried different Ids / created a class with a dedicated width - no result.
This isn’t intuitive at all in the moment.

Doable. You are talking about this layout. You will not enable the mega menu option. You will use the default dropdown element, change the width of the content div and add the nested elements
Screenshot 2023-04-28 at 12.42.17 PM

3 Likes

I know im a year late but have the same issue, I have disabled megamenu and applied a width to the content div but its not working?

I hate explaining visual things with text :slight_smile:

so here just copy pasta

check the values I added or removed

{"content":[{"id":"detgxn","name":"section","parent":0,"children":["mrbiqh"],"settings":{}},{"id":"mrbiqh","name":"container","parent":"detgxn","children":["tmnwjp"],"settings":{}},{"id":"tmnwjp","name":"nav-nested","parent":"mrbiqh","children":["okcbuy","vukzuh"],"settings":{"_width":"100%"}},{"id":"okcbuy","name":"block","parent":"tmnwjp","children":["eqnxtf","tbjsoe","frbmpt","vgazfj"],"settings":{"tag":"ul","_hidden":{"_cssClasses":"brx-nav-nested-items"},"_position":"relative"},"label":"Nav items","cloneable":false,"deletable":false},{"id":"eqnxtf","name":"text-link","parent":"okcbuy","children":[],"settings":{"text":"Home","link":{"type":"external","url":"#"}},"label":"Nav link"},{"id":"tbjsoe","name":"text-link","parent":"okcbuy","children":[],"settings":{"text":"About","link":{"type":"external","url":"#"}},"label":"Nav link"},{"id":"frbmpt","name":"dropdown","parent":"okcbuy","children":["cfgrrr"],"settings":{"text":"Dropdown","_position":"static"},"label":"Dropdown"},{"id":"cfgrrr","name":"div","parent":"frbmpt","children":["xgkuaz","fnhiej"],"settings":{"_hidden":{"_cssClasses":"brx-dropdown-content"},"tag":"ul","_left":"0","_width":"100%"},"label":"Content","cloneable":false,"deletable":false},{"id":"xgkuaz","name":"text-link","parent":"cfgrrr","children":[],"settings":{"text":"Dropdown link 1","link":{"type":"external","url":"#"}},"label":"Nav link"},{"id":"fnhiej","name":"text-link","parent":"cfgrrr","children":[],"settings":{"text":"Dropdown link 2","link":{"type":"external","url":"#"}},"label":"Nav link"},{"id":"vgazfj","name":"toggle","parent":"okcbuy","children":[],"settings":{"_hidden":{"_cssClasses":"brx-toggle-div"}},"label":"Toggle (Close: Mobile)"},{"id":"vukzuh","name":"toggle","parent":"tmnwjp","children":[],"settings":[],"label":"Toggle (Open: Mobile)"}],"source":"bricksCopiedElements","sourceUrl":"https://brickss-snn.s1-tastewp.com","version":"1.9.9","globalClasses":[],"globalElements":[]}

Thanks! I played around some more and found this solution: `