Markdown tables render with misaligned columns in web interface

Description

Markdown tables display with misaligned columns in Claude Code's web interface, making them difficult to read. The same tables render correctly when wrapped in code blocks, indicating the issue is with the markdown table renderer, not the monospace font rendering.

Environment

• Platform: Claude Code on the web
• Browser: Chrome 142.0.7444.60 (arm64)
• OS: macOS

Steps to Reproduce

1. Ask Claude to create any markdown table in the web interface
2. The table columns become misaligned when content lengths vary
3. Example of affected table:

| Command | Description | Usage |
|---------|-------------|-------|
| ls | List files | ls -la |
| grep | Search text patterns | grep -r "pattern" |
| find | Find files and directories | find . -name "*.txt" |

1. The above table's column separators (|) don't align vertically in the web interface

Expected vs Actual Behavior

• Expected: Column separators align vertically, creating readable table columns
• Actual: Column separators shift based on content length, creating a jagged, unreadable table

Workaround

Wrapping the table in triple backticks renders it correctly as a code block, proving the monospace rendering works fine - the issue is specifically with the markdown table parser/renderer.

Technical Analysis

• The markdown table renderer appears to not use monospace font or incorrectly calculate column widths
• This is likely a CSS styling issue or markdown-to-HTML conversion problem in the web interface
• The issue affects all tables with varying content lengths

Impact

• Severity: Medium (workaround exists but degrades markdown experience)
• Frequency: 100% reproducible in web interface
• User Experience: Makes comparison tables, command references, and data tables hard to read
• Affected Users: All users of Claude Code on the web (does not affect other Claude interfaces)

Proposed Solution

Apply monospace font to markdown table elements in the web interface or fix the column width calculation in the markdown renderer to ensure proper alignment regardless of content length.