Dropdown Misalignment During Page Scroll


Topic: Dropdown Misalignment During Page Scroll

Salman Ali pro premium asked 7 days ago

Issue 1: Dropdown Positioning During ScrollProblem: The dropdown menu moves upward with the page scroll, detaching from its parent element in the table header. The appendToBody property doesn't appear to be working as expected in this scenario.

Expected Behavior: The dropdown should either:

Remain fixed to its trigger position (not scroll with the page), or

Properly append to the body and maintain correct positioning during scroll

Issue 2: mdb-select Options Positioning Problem: When using the mdb-select component, the dropdown options list doesn't maintain proper positioning relative to the selector during page scroll.

Expected Behavior: The select options should either:

Track with the selector element during scrolling, or

Maintain fixed positioning relative to the viewport if using body-appended mode

![Image for issue 1][1]

https://usercontent.mdbootstrap.com/mdb-images/support/464fd8a1-4620-452a-8f05-b3b7ade40c51-dropdown.jpg

![Image for issue 2][1]

https://usercontent.mdbootstrap.com/mdb-images/support/8e02155f-d530-4771-8f35-35081fd2f6c9-dropdown2.jpg


Arkadiusz Idzikowski staff commented 5 days ago

Could you please provide an example code and more information about reproduction steps that would help us to recreate such a problem on our end? We checked both dropdown and select menus during scroll but we could not reproduce scenario where the menu is disconnected from the input/trigger.


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 8.0.0
  • Device: Laptop
  • Browser: Google
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes