Content Shifts Horizontally When Interacting with "Select" Component

[RichardLechko]

I'm using the "Select" component in my Astro and Tailwind project, and I've encountered an issue where every time I click on the component, the content below shifts to the left by a couple of pixels. When I click outside of the component, the content shifts back to the right.

I tried addressing this with the following CSS in styles/global.css:

html { overflow-y: scroll; }

This solved a similar issue when using the "Button" component for my dark mode toggle, but it doesn't seem to resolve this new problem with the "Select" component.

I have attached a short clip showing the bug, and here's the repo for reference: GitHub Repo

Would appreciate any feedback or suggestions!

Bug Clip:
https://github.com/user-attachments/assets/2b10f294-c319-42ab-8a97-f0d8f195a3bd

[mashuk-tamim]

I am facing similar issue with next js, shadcn ui Select and tailwind css. Have you solved it yet?