Text wrap issue with auto width

[cdxjcl]

Have you checked closed issues? (https://github.com/Textualize/textual/issues?q=is%3Aissue+is%3Aclosed)

yes

Have you checked against the most recent version of Textual? (https://pypi.org/search/?q=textual)

yes

The bug

Please give a brief but clear explanation of the issue.

I'm not sure if this is expected behavior: I tried rendering a long line of text (wider than the screen) inside a Static widget, with CSS set to width: auto, and also enabled text-wrap . However, the text did not wrap as expected.

When I commented out width: auto, the text started wrapping correctly. I'm wondering if this is a bug, or if I'm misunderstanding how these styles interact in Textual.

from textual.app import App, ComposeResult
from textual.containers import Vertical
from textual.widgets import Static


class AutoWidthApp(App):
    CSS = """
    Vertical {
        border: solid red;
        Static {
            border: solid green;
            width: auto;
            text-wrap: wrap;
        }
    }
    """

    def compose(self) -> ComposeResult:
        long_text = "This is a long text. " * 50
        with Vertical():
            yield Static(
                long_text,
                id="note",
            )


if __name__ == "__main__":
    app = AutoWidthApp()
    app.run()

Screenshots

width: auto

comment out width: auto

Textual Diagnostics

Versions

Name	Value
Textual	5.1.1
Rich	14.1.0

Python

Name	Value
Version	3.13.5
Implementation	CPython
Compiler	MSC v.1943 64 bit (AMD64)
Executable	C:\Users\xxx\AppData\Local\Microsoft\WindowsApps\PythonSoftwareFoundation.Python.3.13_qbz5n2kfra8p0\python.exe

Operating System

Name	Value
System	Windows
Release	11
Version	10.0.26100

Terminal

Name	Value
Terminal Application	Windows Terminal
TERM	Not set
COLORTERM	Not set
FORCE_COLOR	Not set
NO_COLOR	Not set

Rich Console options

Name	Value
size	width=116, height=21
legacy_windows	False
min_width	1
max_width	116
is_terminal	True
encoding	utf-8
max_height	21
justify	None
overflow	None
no_wrap	False
highlight	None
markup	None
height	None

[willmcgugan]

When the width is auto, the widget will be sized wide enough so it doesn't need to wrap.

Note how in your first screenshot, the green border is cropped. If you set overflow: auto on your container, you would be able to scroll to the end of it.

PS If you are not certain if it is a bug, it is best to open a discussion.

[cdxjcl]

Thank you so much!