textual/docs/styles/height.md

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.

=== "height.py"

```python
--8<-- "docs/examples/styles/height.py"
```

=== "height.css"

```python
--8<-- "docs/examples/styles/height.css"
```

=== "Output"

```{.textual path="docs/examples/styles/height.py"}
```

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"