Problem
By default, code cells in blog posts get a horizontal-scroll treatment when their content exceeds the column width. For short single-line entries (e.g. a one-line shell command, a YAML key) this produces an awkward narrow scrollable strip when the content would actually fit if simply wrapped.
Quarto's HTML format supports the code-overflow-wrap option (and a corresponding .code-overflow-wrap class) that flips a code block to white-space: pre-wrap so it wraps instead of scrolling. We don't currently honour that class on this site.
Proposal
Add a CSS rule so that any code block (or its container) carrying the code-overflow-wrap class wraps:
.code-overflow-wrap pre,
pre.code-overflow-wrap,
pre code.code-overflow-wrap {
white-space: pre-wrap;
word-break: break-word;
}
That lets authors opt in per block via Quarto's existing syntax ({.code-overflow-wrap} on a fence, or code-overflow: wrap in the cell options) without changing the default behaviour for code that's genuinely meant to scroll (e.g. wide shell output).
Posts that would benefit
These ported Quarto posts have at least one code cell where wrap would read better than scroll:
content/blog/quarto/2024-01-24-1.4-release/
content/blog/quarto/2024-12-12-includes-meta/
content/blog/quarto/2025-10-20-quarto-wizard-1-0-0/
Surfaced during the Quarto-blog port review.
Problem
By default, code cells in blog posts get a horizontal-scroll treatment when their content exceeds the column width. For short single-line entries (e.g. a one-line shell command, a YAML key) this produces an awkward narrow scrollable strip when the content would actually fit if simply wrapped.
Quarto's HTML format supports the
code-overflow-wrapoption (and a corresponding.code-overflow-wrapclass) that flips a code block towhite-space: pre-wrapso it wraps instead of scrolling. We don't currently honour that class on this site.Proposal
Add a CSS rule so that any code block (or its container) carrying the
code-overflow-wrapclass wraps:That lets authors opt in per block via Quarto's existing syntax (
{.code-overflow-wrap}on a fence, orcode-overflow: wrapin the cell options) without changing the default behaviour for code that's genuinely meant to scroll (e.g. wide shell output).Posts that would benefit
These ported Quarto posts have at least one code cell where wrap would read better than scroll:
content/blog/quarto/2024-01-24-1.4-release/content/blog/quarto/2024-12-12-includes-meta/content/blog/quarto/2025-10-20-quarto-wizard-1-0-0/Surfaced during the Quarto-blog port review.