Merge pull request #704 from Textualize/text-justify

`text-align` CSS support

docs/styles/scrollbar.md

@@ -12,7 +12,7 @@ There are a number of rules to set the colors used in Textual scrollbars. You wo
 | `scrollbar-background-active` | Scrollbar background when the thumb is being dragged    |
 | `scrollbar-corner-color`      | The gap between the horizontal and vertical scrollbars  |
 
-## Example:
+## Syntax
 
 ```
 scrollbar-color: <COLOR>;

docs/styles/text_align.md

@@ -0,0 +1,57 @@
+# Text-align
+
+The `text-align` rule aligns text within a widget.
+
+## Syntax
+
+```
+text-align: [left|start|center|right|end|justify];
+```
+
+### Values
+
+| Value     | Description                      |
+|-----------|----------------------------------|
+| `left`    | Left aligns text in the widget   |
+| `start`   | Left aligns text in the widget   |
+| `center`  | Center aligns text in the widget |
+| `right`   | Right aligns text in the widget  |
+| `end`     | Right aligns text in the widget  |
+| `justify` | Justifies text in the widget     |
+
+## Example
+
+This example shows, from top to bottom: `left`, `center`, `right`, and `justify` text alignments.
+
+=== "text_align.py"
+
+    ```python
+    --8<-- "docs/examples/styles/text_align.py"
+    ```
+
+=== "text_align.css"
+
+    ```css
+    --8<-- "docs/examples/styles/text_align.css"
+    ```
+
+=== "Output"
+
+    ```{.textual path="docs/examples/styles/text_align.py"}
+    ```
+
+## CSS
+
+```sass
+/* Set text in all Widgets to be right aligned */
+Widget {
+    text-align: right;
+}
+```
+
+## Python
+
+```python
+# Set text in the widget to be right aligned
+widget.styles.text_align = "right"
+```