Nav Dropdown Items hide the Nav Items when expanded

Wappler General Need Help
1

Hello everyone,

I am working on left side panel and have used the Navbar Items along with Nav Dropdown. When I expand the Dropdown component, the Dropdown Items hide the Nav Items below it.

Pic 1: Side Panel without expanding Dropdown

image
image809×404 4.15 KB

Pic 2: Dropdown expanded which overlaps the below Nav Items (Hides Nav Item 3,4 & 5)

image

I request your help in achieving below results:

  1. When the dropdown is clicked, the dropdown items should move the Nav Items below it without hiding them?

  2. In case the dropdown is expanded and I click on another Nav Item, the Dropdown menu should collapse & the selected Nav Item highlighted?

2

Bootstrap dropdown menus have a position absolute, so they are covering the items below. You need to set their position to relative in order to “push” the items down, when open.

3

Thanks @Teodor :slightly_smiling_face:
It worked.