claude-code - 💡(How to fix) Fix Horizontal scrollbar always rendered in extension chat panel even when content fits (VSCode extension) [2 comments, 2 participants]

TL;DR

Apply CSS fixes to the panel webview, such as setting overflow-x: hidden on the panel root or min-width: 0 on flex/grid children, to remove the unnecessary horizontal scrollbar.

Guidance

• Investigate the CSS styles applied to the child elements within the panel webview to identify any min-width or white-space: pre properties that could be causing the scrollbar to appear.
• Try setting overflow-x: hidden on the panel root element to prevent the scrollbar from being displayed.
• Check for any flex or grid children that contain wrapped text and set min-width: 0 to allow them to shrink to fit the available space.
• Compare the CSS styles used in the OpenAI Codex VSCode extension to identify potential differences that could be contributing to the issue.

Example

No code snippet is provided as the issue is related to CSS styles and the exact code is not available.

Notes

The suggested fix area provided in the issue is a good starting point, and investigating the CSS styles and applying the suggested fixes should help resolve the issue. However, without access to the actual code, it's difficult to provide a more specific solution.

Recommendation

Apply workaround: Apply the suggested CSS fixes to the panel webview to remove the unnecessary horizontal scrollbar, as the root cause is likely related to the CSS styles used in the extension.