continuedev / continuedev/continue

Sidebar buttons pushed off-screen due to Flexbox overflow

Open Beginner friendly
#12,910 7 comments 8 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

area:sidebar ide:vscode kind:bug os:windows
Dominant language
TypeScript
Stars
36k
Forks
5.4k
PR merge metrics
No merged PRs in 30d

Description

Before submitting your bug report
Relevant environment info
- OS: WIN11
- Continue version: continue.continue-2.0.0-win32-x64
- IDE version: VSCODE
Description

Bug: Sidebar buttons pushed off-screen due to Flexbox overflow

Description

When generating long code blocks without line breaks, the sidebar input buttons (like "Enter") gradually move right until they're off-screen. This happens because:

  1. Flex containers lack min-width: 0
  2. Code blocks don't have max-width: 100% + word-break: break-all
Expected Behavior

Buttons should remain visible regardless of content length.

Workaround

Manually adding these CSS rules to ./assets/index.css fixes it:

.flex, [class*="flex"] { min-width: 0 !important; }
pre, code { max-width: 100% !important; word-break: break-all !important; }
Suggested Fix

Add to global CSS:

.container, .chat-container {
  min-width: 0;
  overflow-x: hidden;
}

### To reproduce

_No response_

### Log output

```Shell

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by inspecting assets/index.css and the sidebar input layout. Reproduce the issue with a long code block without line breaks, then verify that the input buttons remain visible instead of moving off-screen. Done means the overflow is contained and the relevant CSS behavior is covered by the existing project checks.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, typescript
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.