Dropdown creates wrong html-code

Hi,

I'd like to create a Submenu with more levels. For 1 level we can use the "Dropdown" Component. But what if we need a 2. level?

Inserting a 2. "Dropdown" into the existing Dropdown will cause wrong CSS.

The 1. Problem is... a <ul></ul> is missing...

To reproduce:

  1. create a new design
  2. make a Navbar
  3. Drop a "Dropdown" into "html/body/Nabvar/Navbar_Collapse/Nav" (in the Overview) between a "NavItem" ... all is fine
  4. the drop another "Dropdown" into "html/body/Nabvar/Navbar_Collapse/Nav/Dropdown/Menu" between a "Menu Item" ... the preview shows crasy css

Here the code, how it should be for no html-errors:

<li class="dropdown">
    <ul> <!-- *** This is <ul> manually inserted *** -->
        <li class="nav-item dropdown">
            <a href="#">Dropdown </a>
            <div class="dropdown-menu" role="menu">
                <a href="#">2. Level 1</a>
                <a href="#">2. Level 2</a>
                <a href="#">2. Level 3</a>
            </div>
        </li>
    </ul> <!-- *** This </ul> is manually inserted *** -->
    <a href="#">First Item</a>
    <a href="#">Second Item</a>
    <a href="#">Third Item</a>
</li>

but the CSS is still broken

So, I think it's better you disallow dropping a 2. Dropdown into an other, and make another Component for Multilevel Menue with for e.g. unorderd lists

or

inserting some </p>

<p><</p>

<p>ul> and some CSS

Is the tutorial wrong?

https://www.bootstrapstudio.io/tutorials/multilevel-dropdowns

https://www.bootstrapstudio.io/resources/multilevel-dropdowns.bsdesign

The Cards seems working...

I talked about the "Navbar"

The links he put are for multilevel-dropdowns for navs. Not sure where you got the idea of cards from on them. :)

I didn't. :)

Not you silly lol. I gotta quit being a lazy type and clarify who I am talking to lol.

@Frank

I was not able to make it work either that way. I went the route of using all ul. Only problem is that you have to type in the class "open" to view sub menu's which is a real pain. Need to be able to toggle open and close please.

Now you know why I use 3rd party menus lol. Yes I have to do it all by code with a custom code block, but since that's what I've done for years before using this app that's not a big deal for me :)

I uploaded mine as a component if helps anyone. Navbar Multidropdown Bootstrap 4

You just have to add that pesky "open" class to see them and then remove it when you are done. Sometimes it can get a "little" buggy if you click in the wrong spot after doing so. I always make sure the class is applied before editing the canvas.

@Twinstream

I just wanted to create the same you did...

Thank you for being faster :)