Question 173253 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Headless UI Tailwind Menu display issue

I am using Tailwind with Headless UI for my react project. I am having a display issue for Headless UI Menu as shown i the below images –

Correct display –

enter image description here

Problematic display –

enter image description here

The menu is open but not displayed outside of the parent. please help me how to resolve this issue.

Tags:

2

Answers


  1. 0

    It seems like the menu is being displayed inside an element with overflow: hidden applied. Consider removing the overflow: hidden from the parent element, or move the menu outside the overflow: hidden element by using a portal.

    Login or Signup to reply.
  2. 0

    Add an overflow: visible to the parent (seems to be a <table> element in your case) and that popup will work as expected

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search