The markdown wrapper used min-w-full, forcing message content to be at least the full width of its parent. Code blocks with varying intrinsic widths made bubbles expand/contract while scrolling.
Fix
Replaced min-w-full with min-w-0 in the markdown wrapper divs. min-w-0 lets the wrapper shrink within its flex/grid container while code blocks keep using their existing horizontal overflow handling.
Verified only Tailwind width utility class changes
Scenario: widescreen + chat bubble mode with YAML code blocks; stable bubble width while scrolling
Contributor License Agreement
Keep the "Contributor License Agreement" confirmation text intact.
Deleting it will trigger the CLA-Bot to INVALIDATE your PR.
Your PR will NOT be reviewed or merged until you check the box below confirming that you have read and agree to the terms of the CLA.
By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.
Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in.
🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.
## 📋 Pull Request Information
**Original PR:** https://github.com/open-webui/open-webui/pull/24961
**Author:** [@sisyphusse1-ops](https://github.com/sisyphusse1-ops)
**Created:** 5/20/2026
**Status:** ❌ Closed
**Base:** `dev` ← **Head:** `fix/yaml-bubble-sizing-clean`
---
### 📝 Commits (1)
- [`1895229`](https://github.com/open-webui/open-webui/commit/1895229f911399045399708351bd8fb363470fb5) fix: consistent YAML code block bubble sizing
### 📊 Changes
**3 files changed** (+5 additions, -5 deletions)
<details>
<summary>View changed files</summary>
📝 `src/lib/components/chat/Messages/MultiResponseMessages.svelte` (+3 -3)
📝 `src/lib/components/chat/Messages/ResponseMessage.svelte` (+1 -1)
📝 `src/lib/components/chat/Messages/UserMessage.svelte` (+1 -1)
</details>
### 📄 Description
## Summary
Fixes #5975 — YAML code blocks caused inconsistent conversation bubble sizing in widescreen chat bubble mode.
## Root Cause
The markdown wrapper used `min-w-full`, forcing message content to be at least the full width of its parent. Code blocks with varying intrinsic widths made bubbles expand/contract while scrolling.
## Fix
Replaced `min-w-full` with `min-w-0` in the markdown wrapper divs. `min-w-0` lets the wrapper shrink within its flex/grid container while code blocks keep using their existing horizontal overflow handling.
## Files Changed
- `src/lib/components/chat/Messages/ResponseMessage.svelte`
- `src/lib/components/chat/Messages/UserMessage.svelte`
- `src/lib/components/chat/Messages/MultiResponseMessages.svelte`
## Testing
- Verified only Tailwind width utility class changes
- Scenario: widescreen + chat bubble mode with YAML code blocks; stable bubble width while scrolling
### Contributor License Agreement
Keep the "Contributor License Agreement" confirmation text intact.
Deleting it will trigger the CLA-Bot to INVALIDATE your PR.
Your PR will NOT be reviewed or merged until you check the box below confirming that you have read and agree to the terms of the CLA.
- [x] By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](https://github.com/open-webui/open-webui/blob/main/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms.
> Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in.
---
<sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
📋 Pull Request Information
Original PR: https://github.com/open-webui/open-webui/pull/24961
Author: @sisyphusse1-ops
Created: 5/20/2026
Status: ❌ Closed
Base:
dev← Head:fix/yaml-bubble-sizing-clean📝 Commits (1)
1895229fix: consistent YAML code block bubble sizing📊 Changes
3 files changed (+5 additions, -5 deletions)
View changed files
📝
src/lib/components/chat/Messages/MultiResponseMessages.svelte(+3 -3)📝
src/lib/components/chat/Messages/ResponseMessage.svelte(+1 -1)📝
src/lib/components/chat/Messages/UserMessage.svelte(+1 -1)📄 Description
Summary
Fixes #5975 — YAML code blocks caused inconsistent conversation bubble sizing in widescreen chat bubble mode.
Root Cause
The markdown wrapper used
min-w-full, forcing message content to be at least the full width of its parent. Code blocks with varying intrinsic widths made bubbles expand/contract while scrolling.Fix
Replaced
min-w-fullwithmin-w-0in the markdown wrapper divs.min-w-0lets the wrapper shrink within its flex/grid container while code blocks keep using their existing horizontal overflow handling.Files Changed
src/lib/components/chat/Messages/ResponseMessage.sveltesrc/lib/components/chat/Messages/UserMessage.sveltesrc/lib/components/chat/Messages/MultiResponseMessages.svelteTesting
Contributor License Agreement
Keep the "Contributor License Agreement" confirmation text intact.
Deleting it will trigger the CLA-Bot to INVALIDATE your PR.
Your PR will NOT be reviewed or merged until you check the box below confirming that you have read and agree to the terms of the CLA.
🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.