Topic: Dropdown Nav item doesn't work with mdbTooltip
                  
                  bitjuice
                  pro
                  asked 6 years ago
                
Hi,
I have a problem using mdbTooltip on a dropdown nav-item of mdb-navbar
<li class="nav-item dropdown" dropdown>
        <a dropdownToggle mdbWavesEffect type="button" class="nav-link dropdown-toggle waves-light" mdbTooltip="User" placement="bottom">
          <mdb-icon fas icon="user"></mdb-icon>
        </a>
        <div *dropdownMenu class="dropdown-menu dropdown-menu-right dropdown dropdown-primary" role="menu">
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">My account</a>
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">Log out</a>
        </div>
      </li>
When I click on user icon, the dropdown is not displayed
If I remove
mdbTooltip="User" placement="bottom"
it works
Can you help me please?
Thanks
Marco
                      
                      Arkadiusz Idzikowski
                      staff
                        answered 6 years ago
                    
This problem will be resolved in next version of MDB Angular. As a workaround for now you can add container="body" input to the element with mdbTooltip directive.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Pro
 - Premium support: No
 - Technology: MDB Angular
 - MDB Version: 7.5.4
 - Device: PC
 - Browser: Chorme
 - OS: Windows 10
 - Provided sample code: No
 - Provided link: No
 
Arkadiusz Idzikowski staff commented 6 years ago
That's very strange, we will take a closer look at this. I'm afraid there is no easy workaround for now. Normally I would recommend to add mdbTooltip directive to the mdb-icon element, but in this case I see that there are also some problems with tooltip arrow placemenent when you do that.