From 378f25a2b4d07663a659e8c7a2dd991543b1a20b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rodrigo=20Gir=C3=A3o=20Serr=C3=A3o?=
 <5621605+rodrigogiraoserrao@users.noreply.github.com>
Date: Thu, 15 Dec 2022 18:10:22 +0000
Subject: [PATCH] Add example app with content alignment grid.

---
 docs/examples/styles/content_align_all.css | 39 ++++++++++++++++++++++
 docs/examples/styles/content_align_all.py  | 18 ++++++++++
 2 files changed, 57 insertions(+)
 create mode 100644 docs/examples/styles/content_align_all.css
 create mode 100644 docs/examples/styles/content_align_all.py

diff --git a/docs/examples/styles/content_align_all.css b/docs/examples/styles/content_align_all.css
new file mode 100644
index 000000000..1d1e099a3
--- /dev/null
+++ b/docs/examples/styles/content_align_all.css
@@ -0,0 +1,39 @@
+#left-top {
+    /* content-align: left top; this is the default implied value. */
+}
+#center-top {
+    content-align: center top;
+}
+#right-top {
+    content-align: right top;
+}
+#left-middle {
+    content-align: left middle;
+}
+#center-middle {
+    content-align: center middle;
+}
+#right-middle {
+    content-align: right middle;
+}
+#left-bottom {
+    content-align: left bottom;
+}
+#center-bottom {
+    content-align: center bottom;
+}
+#right-bottom {
+    content-align: right bottom;
+}
+
+Screen {
+    layout: grid;
+    grid-size: 3 3;
+    grid-gutter: 1;
+}
+
+Label {
+    width: 100%;
+    height: 100%;
+    background: $primary;
+}
diff --git a/docs/examples/styles/content_align_all.py b/docs/examples/styles/content_align_all.py
new file mode 100644
index 000000000..046011667
--- /dev/null
+++ b/docs/examples/styles/content_align_all.py
@@ -0,0 +1,18 @@
+from textual.app import App
+from textual.widgets import Label
+
+
+class AllContentAlignApp(App):
+    def compose(self):
+        yield Label("left top", id="left-top")
+        yield Label("center top", id="center-top")
+        yield Label("right top", id="right-top")
+        yield Label("left middle", id="left-middle")
+        yield Label("center middle", id="center-middle")
+        yield Label("right middle", id="right-middle")
+        yield Label("left bottom", id="left-bottom")
+        yield Label("center bottom", id="center-bottom")
+        yield Label("right bottom", id="right-bottom")
+
+
+app = AllContentAlignApp(css_path="content_align_all.css")