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
- create a new design
- make a Navbar
- Drop a “Dropdown” into “html/body/Nabvar/Navbar_Collapse/Nav” (in the Overview) between a “NavItem”
… all is fine
- 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
<p>ul> and some CSSTwinstreamMember
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.
You must be logged in to reply to this topic.