Skip to content

Height

The height rule sets a widget's height. By default, it sets the height of the content area, but if box-sizing is set to border-box it sets the height of the border area.

Syntax

height: <SCALAR>;

Example

This examples creates a widget with a height of 50% of the screen.

from textual.app import App
from textual.widget import Widget


class HeightApp(App):
    def compose(self):
        yield Widget()


app = HeightApp(css_path="height.css")
Screen > Widget {     
    background: green;
    height: 50%;
    color: white;
}

HeightApp Widget

CSS

/* Explicit cell height */
height: 10;

/* Percentage height */
height: 50%;

/* Automatic height */
width: auto

Python

self.styles.height = 10
self.styles.height = "50%"
self.styles.height = "auto"