Horizontal dropdown item menu

Bootstrap Studio Help
1

Hello,
Can the items on a dropdown menu display horizontal as well?

2

You can try this
html

<div class="dropdown">
  <button class="btn btn-primary dropdown-toggle" aria-expanded="false" data-bs-toggle="dropdown" type="button">Dropdown </button>
  <div class="dropdown-menu horizontal">
    <a class="dropdown-item" href="#">First Item</a>
    <a class="dropdown-item" href="#">Second Item</a>
    <a class="dropdown-item" href="#">Third Item</a>
  </div>
</div>

CSS

.horizontal.dropdown-menu.show {
  display: flex;
}
3

Thank you for your pront response.

I am not a code person, thus this way is difficult for me to implement. But if is doable then there should be an option to either have it display horizontal or vertical. Maybe a suggestion for next updated?

4

In the Overview panel (lower left,) find the Menu item in which you want the links to to display horizontally and select it.

On the right side go to Options panel, scroll down to Flexbox, and change the Flex Container setting from Default To Flex.

(keep in mind that Flexbox settings are breakpoint-specific. Since I can’t imagine you’d want the dropdown menu to display horizontally on smaller screens, be sure to expand the Flex Container options and choose Flex on only those screen sizes that will accommodate a horizontal layout.)