Skip to content


The text-align style sets the text alignment in a widget.


text-align: <text-align>;

The text-align style accepts a value of the type <text-align> that defines how text is aligned inside the widget.


The default value is start.


This example shows, from top to bottom: left, center, right, and justify text alignments.

TextAlign Left alignedCenter aligned I must not fear. Fear is the            I must not fear. Fear is the     mind-killer. Fear is the                  mind-killer. Fear is the       little-death that brings total         little-death that brings total    obliteration. I will face my fear. Iobliteration. I will face my fear. I will permit it to pass over me and   will permit it to pass over me and  through me.                                     through me.              Right alignedJustified         I must not fear. Fear is theI  must  not  fear.  Fear   is   the             mind-killer. Fear is themind-killer.     Fear     is     the       little-death that brings totallittle-death   that   brings   total obliteration. I will face my fear. Iobliteration. I will face my fear. I   will permit it to pass over me andwill permit it to pass over  me  and                          through me.through me.

from import App
from textual.containers import Grid
from textual.widgets import Label

TEXT = (
    "I must not fear. Fear is the mind-killer. Fear is the little-death that "
    "brings total obliteration. I will face my fear. I will permit it to pass over "
    "me and through me."

class TextAlign(App):
    CSS_PATH = "text_align.tcss"

    def compose(self):
        yield Grid(
            Label("[b]Left aligned[/]\n" + TEXT, id="one"),
            Label("[b]Center aligned[/]\n" + TEXT, id="two"),
            Label("[b]Right aligned[/]\n" + TEXT, id="three"),
            Label("[b]Justified[/]\n" + TEXT, id="four"),

if __name__ == "__main__":
    app = TextAlign()
#one {
    text-align: left;
    background: lightblue;

#two {
    text-align: center;
    background: indianred;

#three {
    text-align: right;
    background: palegreen;

#four {
    text-align: justify;
    background: palevioletred;

Label {
    padding: 1 2;
    height: 100%;
    color: auto;

Grid {
    grid-size: 2 2;


/* Set text in the widget to be right aligned */
text-align: right;


# Set text in the widget to be right aligned
widget.styles.text_align = "right"

See also

  • align to set the alignment of children widgets inside a container.
  • content-align to set the alignment of content inside a widget.