Add a FAQ about aligning things in the middle of a container

This commit is contained in:
Dave Pearson
2022-12-20 21:27:29 +00:00
parent dd2b89bd5c
commit 94a2175eba

View File

@@ -0,0 +1,34 @@
---
title: "How do I center a widget in a screen?"
alt_titles:
- "centre a widget"
- "center a control"
- "centre a control"
---
To center a widget within a container use
[`align`](https://textual.textualize.io/styles/align/). But remember that
`align` works on the *children* of a container, it isn't something you use
on the child you want centered.
For example, here's an app that shows a `Button` in the middle of a
`Screen`:
```python
from textual.app import App, ComposeResult
from textual.widgets import Button
class ButtonApp(App):
CSS = """
Screen {
align: center middle;
}
"""
def compose(self) -> ComposeResult:
yield Button("PUSH ME!")
if __name__ == "__main__":
ButtonApp().run()
```