### Preflight Checklist - [x] I have searched [existing issues](https://github.com/anthropics/claude-code/issues?q=is%3Aissue%20state%3Aopen%20label%3Abug) and this hasn't been reported yet - [x] This is a single bug report (please file separate reports for different bugs) - [x] I am using the latest version of Claude Code ### What's Wrong? The Claude Code webview panel always renders a horizontal scrollbar at the bottom, even when nothing overflows. Dragging it moves nothing. **Note on prio

VSCode extension: empty <pre id="claude-error"> forces a permanent 1px horizontal scrollbar in the webview

Status Open

Reported on v2.1.236

Maintainer reply None cached

Activity 1 comment · opened Aug 20, 2026

Preflight Checklist

[x] I have searched existing issues and this hasn't been reported yet
[x] This is a single bug report (please file separate reports for different bugs)
[x] I am using the latest version of Claude Code

What's Wrong?

The Claude Code webview panel always renders a horizontal scrollbar at the bottom, even when nothing overflows. Dragging it moves nothing.

Note on prior reports: this has been filed three times - #49085, #49677, #54830 - and all three were auto-closed as duplicates of #24643. However #24643 is a different bug (area:tui, text clipping in the Claude for Mac app), and it was itself closed as NOT_PLANNED. The duplicate detection misrouted them, so this problem has never actually been triaged. None of the three identified the offending element.

Root cause (confirmed): the first child of <body> in the webview is <pre id="claude-error"></pre>. Even while empty it occupies 1px, pushing document.body.scrollWidth exactly 1px past documentElement.clientWidth:

window width       609
body.scrollWidth   610   ->  1px overflow  ->  permanent scrollbar

Suggested fix:

#claude-error:empty { display: none; }

The :empty guard keeps the error banner working when it actually has content. I applied this to webview/index.css locally and the scrollbar is gone with no side effects.

What Should Happen?

No horizontal scrollbar should appear when the content fits the panel width.

Error Messages/Logs

Steps to Reproduce

Open the Claude Code panel in VS Code (any state: idle, mid-response, permission prompt).
A horizontal scrollbar is present at the bottom of the panel. Dragging it moves nothing.

To confirm the cause, open DevTools, switch the console context to the webview frame (active-frame (index.html) - not top), and run:

document.querySelector('#claude-error').style.display = 'none';
console.log(document.body.scrollWidth, document.documentElement.clientWidth);

610 / 609 becomes 609 / 609 and the scrollbar disappears immediately.

To find it from scratch, hide elements one at a time and watch body.scrollWidth shrink:

const B = document.body;
(function dig(el) {
  const base = B.scrollWidth;
  for (const c of el.children) {
    const d = c.style.display;
    c.style.display = 'none';
    const after = B.scrollWidth;
    c.style.display = d;
    if (after < base) return c.children.length ? dig(c) : console.log('culprit:', c);
  }
})(B);

Claude Model

Not sure / Multiple models

Is this a regression?

I don't know

Last Working Version

_No response_

Claude Code Version

2.1.236 (VSCode extension, darwin-arm64)

Platform

Anthropic API

Operating System

macOS

Terminal/Shell

Other

Additional Information

Environment detail: VS Code 1.134.0, macOS 26.5.2, extension 2.1.236 (darwin-arm64).

Terminal/Shell is set to Other because this is a webview rendering issue, not a terminal one.

Related closed reports: #49085, #49677, #54830 - all auto-closed as duplicates of #24643, which is an area:tui bug in the Mac app and unrelated to the VS Code webview.

View original on GitHub ↗

This issue has 1 comment on GitHub. Read the full discussion on GitHub ↗