NO BUG: Dropdown element content tag

Browser: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: Link to a page that illustrates this issue
Video: Short screen recording that illustrates this issue (free tool: jam.dev)

Hello,

In the dropdown element, if we select the content item, it displays a div tag. however, on the front end, it has a ul tag. It would be great if we could configure the dropdown content so that it doesn’t use ul and li tags. This will be useful for creating a Mini Cart dropdown in version 2.4.

Best regards

Hi @jolia.

This is expected behavior for the regular Dropdown element. Bricks renders regular dropdown content as a navigation list structure, so the content wrapper becomes ul and child items are wrapped as li items on the frontend.

For a custom structure such as a Mini Cart dropdown, enable Mega menu on the Dropdown element. In Mega menu mode, Bricks does not automatically wrap children in li tags, and the Dropdown Content HTML tag control can be used for a custom wrapper.

Related answer: NO BUG: Dropdown Content HTML tag.

I’ve also marked this as a no-bug.

Matej

1 Like

Hi @Matej,

Thanks for the guidance. Just one thing: the mega menu defaults to full width, and the “Min. width” control in the dropdown content group doesn’t seem to work at all. So, how can we set a custom width for the mega menu content for example, 300px?

Hi @jolia,

Yes. In the current release, Mega menu mode uses the horizontal CSS selector/reference width for the panel and defaults to the available page width. That is why the normal Content > Min. width control can appear ineffective for a fixed small panel.

For a 300px panel today, either set the Mega menu CSS selector to an element that is 300px wide, or add custom CSS to this Dropdown element:

%root%.brx-has-megamenu > .brx-dropdown-content {
  left: 0 !important;
  min-width: 300px !important;
  width: 300px;
}

A direct Mega menu width control is already tracked internally, so the current workaround should no longer be needed once that ships.

Best regards,
Matej

1 Like

Hi @Matej,

Sorry, did you mean that a new control for the width of the mega menu will be added in the next version?

Not necessary in the next version, but there will be a new control/settings that will allow to add Mega Menu width easily via UI.

I can see it has already been worked on, but I can’t promise when it will ship.

Matej

1 Like