← Back to Dashboard
Verified Production Fix

[gitlab-org/gitlab] Reaction picker has two vertical scrollbars

GL-gitlab-org/gitlab#592668 • Mar 07, 2026

### ROOT CAUSE The reaction picker panel is both scrollable and positioned within another scrollable container (like a comment list), leading to two vertical scrollbars when the panel's content exceeds its height. ### CODE FIX To fix the double scrollbar issue, modify the reaction picker panel's CSS to ensure it doesn't introduce its own scrollbar when already within a scrollable context. Adjust the panel's height and overflow properties. **Step-by-Step Explanation:** 1. **Identify the Scrollable Containers:** The reaction picker panel is inside a scrollable container (e.g., a comment list). This causes both containers to display scrollbars when their content overflows. 2. **Modify the Panel's Height:** Set the reaction picker panel's height to `auto` or a dynamic value based on available space to prevent it from needing an internal scrollbar. 3. **Remove Overflow Property:** Remove `overflow-y: auto` from the reaction picker's CSS to prevent it from creating its own scrollbar. 4. **Adjust Z-Index if Needed:** Ensure the panel's z-index is correct so it overlays properly without causing layout issues. **Code Fix:**
css
/* Modify the reaction picker panel styles */
.reaction-picker-panel {
  /* Remove fixed height to allow dynamic sizing */
  height: auto;
  /* Remove overflow to prevent internal scrollbar */
  overflow-y: hidden;
}

/* Ensure the panel fits within the parent container */
.parent-container {
  /* Adjust height or other properties as needed */
  height: 100%;
}


This fix ensures the reaction picker panel doesn't create its own scrollbar, resolving the double scrollbar issue.

Deploy with DigitalOcean

Use this fix in production instantly. Claim your $200 developer credit.

Get Started →