From 8c0f1dc83c4dbd37c8e1bb5bc3f6961b38df58dd 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, 22 Dec 2022 18:13:36 +0000
Subject: [PATCH] Fix links to CSS types.
---
docs/styles/_template.md | 5 ++++-
docs/styles/align.md | 12 ++++++------
docs/styles/background.md | 4 ++--
docs/styles/border.md | 12 ++++++------
docs/styles/color.md | 6 +++---
docs/styles/content_align.md | 12 ++++++------
docs/styles/grid/column_span.md | 4 ++--
docs/styles/grid/grid_columns.md | 6 +++---
docs/styles/grid/grid_gutter.md | 6 +++---
docs/styles/grid/grid_rows.md | 6 +++---
docs/styles/grid/grid_size.md | 4 ++--
docs/styles/grid/index.md | 12 ++++++------
docs/styles/grid/row_span.md | 4 ++--
docs/styles/height.md | 4 ++--
docs/styles/layer.md | 6 +++---
docs/styles/layers.md | 4 ++--
docs/styles/links/index.md | 12 ++++++------
docs/styles/links/link_background.md | 4 ++--
docs/styles/links/link_color.md | 4 ++--
docs/styles/links/link_hover_background.md | 4 ++--
docs/styles/links/link_hover_color.md | 4 ++--
docs/styles/links/link_hover_style.md | 4 ++--
docs/styles/links/link_style.md | 2 +-
docs/styles/margin.md | 22 +++++++++++-----------
docs/styles/max_height.md | 4 ++--
docs/styles/max_width.md | 4 ++--
docs/styles/min_height.md | 4 ++--
docs/styles/min_width.md | 4 ++--
docs/styles/offset.md | 8 ++++----
29 files changed, 95 insertions(+), 92 deletions(-)
diff --git a/docs/styles/_template.md b/docs/styles/_template.md
index 772d905c7..c92c701f7 100644
--- a/docs/styles/_template.md
+++ b/docs/styles/_template.md
@@ -8,7 +8,10 @@ One or two sentences is typically enough. -->
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-
+
--8<-- "docs/snippets/syntax_block_end.md"
diff --git a/docs/styles/align.md b/docs/styles/align.md
index 41fb1b80f..0f3121f01 100644
--- a/docs/styles/align.md
+++ b/docs/styles/align.md
@@ -6,20 +6,20 @@ Not to be confused with [`content-align`](../content_align).
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-align: <horizontal> <vertical>;
+align: <horizontal> <vertical>;
-align-horizontal: <horizontal>;
-align-vertical: <vertical>;
+align-horizontal: <horizontal>;
+align-vertical: <vertical>;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `align` takes a [``](../css_types/horizontal.md) followed by a [``](../css_types/vertical.md).
+The style `align` takes a [``](../../css_types/horizontal) followed by a [``](../../css_types/vertical).
You can specify the alignment of children on both the horizontal and vertical axes at the same time,
or on each of the axis separately.
To specify alignment on a single axis, use the respective style and type:
- - `align-horizontal` takes a [``](../css_types/horizontal.md) and does alignment along the horizontal axis; and
- - `align-vertical` takes a [``](../css_types/vertical.md) and does alignment along the vertical axis.
+ - `align-horizontal` takes a [``](../../css_types/horizontal) and does alignment along the horizontal axis; and
+ - `align-vertical` takes a [``](../../css_types/vertical) and does alignment along the vertical axis.
### Values
diff --git a/docs/styles/background.md b/docs/styles/background.md
index be2d7f867..d22581a57 100644
--- a/docs/styles/background.md
+++ b/docs/styles/background.md
@@ -5,10 +5,10 @@ The `background` rule sets the background color of a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-background: <color> [<percentage>];
+background: <color> [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-The style `background` needs a [``](../css_types/color.md) followed by an optional [``](../css_types/percentage.md) to specify the color transparency.
+The style `background` needs a [``](../../css_types/color) followed by an optional [``](../../css_types/percentage) to specify the color transparency.
### Values
diff --git a/docs/styles/border.md b/docs/styles/border.md
index 3d9ce909d..15013f650 100644
--- a/docs/styles/border.md
+++ b/docs/styles/border.md
@@ -5,15 +5,15 @@ The `border` rule enables the drawing of a box around a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-border: [<border>] [<color>];
+border: [<border>] [<color>];
-border-top: [<border>] [<color>];
-border-right: [<border>] [<color>];
-border-bottom: [<border>] [<color>];
-border-left: [<border>] [<color>];
+border-top: [<border>] [<color>];
+border-right: [<border>] [<color>];
+border-bottom: [<border>] [<color>];
+border-left: [<border>] [<color>];
--8<-- "docs/snippets/syntax_block_end.md"
-The style `border` accepts an optional [``](../css_types/border.md) that sets the visual style of the widget border and an optional [``](../css_types/color.md) to set the color of the border.
+The style `border` accepts an optional [``](../../css_types/border) that sets the visual style of the widget border and an optional [``](../../css_types/color) to set the color of the border.
Borders may also be set individually for the four edges of a widget with the `border-top`, `border-right`, `border-bottom` and `border-left` rules.
diff --git a/docs/styles/color.md b/docs/styles/color.md
index e12e72df4..4db2eccb4 100644
--- a/docs/styles/color.md
+++ b/docs/styles/color.md
@@ -5,12 +5,12 @@ The `color` rule sets the text color of a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-color: (<color> | auto) [<percentage>];
+color: (<color> | auto) [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-The style `color` needs a [``](../css_types/color.md) followed by an optional [``](../css_types/percentage.md) to specify the color transparency.
+The style `color` needs a [``](../../css_types/color) followed by an optional [``](../../css_types/percentage) to specify the color transparency.
-Instead of a [``](../css_types/color.md), one can use the special value `"auto"` to choose automatically the color with the best contrast for readability purposes.
+Instead of a [``](../../css_types/color), one can use the special value `"auto"` to choose automatically the color with the best contrast for readability purposes.
### Values
diff --git a/docs/styles/content_align.md b/docs/styles/content_align.md
index 5208314ca..bdf073199 100644
--- a/docs/styles/content_align.md
+++ b/docs/styles/content_align.md
@@ -7,20 +7,20 @@ Not to be confused with [`align`](../align).
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-content-align: <horizontal> <vertical>;
+content-align: <horizontal> <vertical>;
-content-align-horizontal: <horizontal>;
-content-align-vertical: <vertical>;
+content-align-horizontal: <horizontal>;
+content-align-vertical: <vertical>;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `content-align` takes a [``](../css_types/horizontal.md) followed by a [``](../css_types/vertical.md).
+The style `content-align` takes a [``](../../css_types/horizontal) followed by a [``](../../css_types/vertical).
You can specify the alignment of content on both the horizontal and vertical axes at the same time,
or on each of the axis separately.
To specify content alignment on a single axis, use the respective style and type:
- - `content-align-horizontal` takes a [``](../css_types/horizontal.md) and does alignment along the horizontal axis; and
- - `content-align-vertical` takes a [``](../css_types/vertical.md) and does alignment along the vertical axis.
+ - `content-align-horizontal` takes a [``](../../css_types/horizontal) and does alignment along the horizontal axis; and
+ - `content-align-vertical` takes a [``](../../css_types/vertical) and does alignment along the vertical axis.
### Values
diff --git a/docs/styles/grid/column_span.md b/docs/styles/grid/column_span.md
index e86e5dcfe..7f02b87d4 100644
--- a/docs/styles/grid/column_span.md
+++ b/docs/styles/grid/column_span.md
@@ -9,10 +9,10 @@ The `column-span` style specifies how many rows a widget will span in a grid lay
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-column-span: <integer>;
+column-span: <integer>;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `column-span` accepts a single non-negative [``](../../css_types/integer.md) that quantifies how many columns the given widget spans.
+The style `column-span` accepts a single non-negative [``](../../../css_types/integer) that quantifies how many columns the given widget spans.
### Values
diff --git a/docs/styles/grid/grid_columns.md b/docs/styles/grid/grid_columns.md
index 78d57371f..f603fde86 100644
--- a/docs/styles/grid/grid_columns.md
+++ b/docs/styles/grid/grid_columns.md
@@ -9,13 +9,13 @@ The `grid-columns` style allows to define the width of the columns of the grid.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-grid-columns: <scalar>+;
+grid-columns: <scalar>+;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `grid-columns` takes one or more [``](../../css_types/scalar.md) that specify the length of the columns of the grid.
+The style `grid-columns` takes one or more [``](../../../css_types/scalar) that specify the length of the columns of the grid.
If there are more columns in the grid than scalars specified in `grid-columns`, they are reused cyclically.
-If the number of [``](../../css_types/scalar.md) is in excess, the excess is ignored.
+If the number of [``](../../../css_types/scalar) is in excess, the excess is ignored.
### Values
diff --git a/docs/styles/grid/grid_gutter.md b/docs/styles/grid/grid_gutter.md
index 23d3c113f..2488f95f0 100644
--- a/docs/styles/grid/grid_gutter.md
+++ b/docs/styles/grid/grid_gutter.md
@@ -13,11 +13,11 @@ No spacing is added between the edges of cells and the edges of the container.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-grid-gutter: <scalar> [<scalar>];
+grid-gutter: <scalar> [<scalar>];
--8<-- "docs/snippets/syntax_block_end.md"
-The style `grid-gutter` takes one or two [``](../../css_types/scalar.md) that set the length of the gutter along the vertical and horizontal axes.
-If only one [``](../../css_types/scalar.md) is supplied, it sets the vertical and horizontal gutters.
+The style `grid-gutter` takes one or two [``](../../../css_types/scalar) that set the length of the gutter along the vertical and horizontal axes.
+If only one [``](../../../css_types/scalar) is supplied, it sets the vertical and horizontal gutters.
If two are supplied, they set the vertical and horizontal gutters, respectively.
### Values
diff --git a/docs/styles/grid/grid_rows.md b/docs/styles/grid/grid_rows.md
index b3945b0bb..72b12b270 100644
--- a/docs/styles/grid/grid_rows.md
+++ b/docs/styles/grid/grid_rows.md
@@ -9,13 +9,13 @@ The `grid-rows` style allows to define the height of the rows of the grid.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-grid-rows: <scalar>+;
+grid-rows: <scalar>+;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `grid-rows` takes one or more [``](../../css_types/scalar.md) that specify the length of the rows of the grid.
+The style `grid-rows` takes one or more [``](../../../css_types/scalar) that specify the length of the rows of the grid.
If there are more rows in the grid than scalars specified in `grid-rows`, they are reused cyclically.
-If the number of [``](../../css_types/scalar.md) is in excess, the excess is ignored.
+If the number of [``](../../../css_types/scalar) is in excess, the excess is ignored.
### Values
diff --git a/docs/styles/grid/grid_size.md b/docs/styles/grid/grid_size.md
index 970b96e5b..b35e4d391 100644
--- a/docs/styles/grid/grid_size.md
+++ b/docs/styles/grid/grid_size.md
@@ -11,10 +11,10 @@ The number of rows can be left unspecified and it will be computed automatically
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-grid-size: <integer> [<integer>];
+grid-size: <integer> [<integer>];
--8<-- "docs/snippets/syntax_block_end.md"
-The style `grid-size` takes one or two non-negative [``](../../css_types/integer.md).
+The style `grid-size` takes one or two non-negative [``](../../../css_types/integer).
The first defines how many columns there are in the grid.
If present, the second one sets the number of rows – regardless of the number of children of the grid –, otherwise the number of rows is computed automatically.
diff --git a/docs/styles/grid/index.md b/docs/styles/grid/index.md
index 4f7390ed5..b96f1fbd5 100644
--- a/docs/styles/grid/index.md
+++ b/docs/styles/grid/index.md
@@ -16,17 +16,17 @@ For an in-depth look at the grid layout, visit the grid [guide](../guide/layout.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-column-span: <integer>;
+column-span: <integer>;
-grid-columns: <scalar>+;
+grid-columns: <scalar>+;
-grid-gutter: <scalar> [<scalar>];
+grid-gutter: <scalar> [<scalar>];
-grid-rows: <scalar>+;
+grid-rows: <scalar>+;
-grid-size: <integer> [<integer>];
+grid-size: <integer> [<integer>];
-row-span: <integer>;
+row-span: <integer>;
--8<-- "docs/snippets/syntax_block_end.md"
Visit each style's reference page to learn more about how the values are used.
diff --git a/docs/styles/grid/row_span.md b/docs/styles/grid/row_span.md
index ff1258302..8e874480b 100644
--- a/docs/styles/grid/row_span.md
+++ b/docs/styles/grid/row_span.md
@@ -9,10 +9,10 @@ The `row-span` style specifies how many rows a widget will span in a grid layout
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-row-span: <integer>;
+row-span: <integer>;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `row-span` accepts a single non-negative [``](../../css_types/integer.md) that quantifies how many rows the given widget spans.
+The style `row-span` accepts a single non-negative [``](../../../css_types/integer) that quantifies how many rows the given widget spans.
### Values
diff --git a/docs/styles/height.md b/docs/styles/height.md
index b198ebecb..a4858a95f 100644
--- a/docs/styles/height.md
+++ b/docs/styles/height.md
@@ -5,10 +5,10 @@ The `height` rule sets a widget's height.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-height: <scalar>;
+height: <scalar>;
--8<-- "docs/snippets/syntax_block_end.md"
-The style `height` needs a [``](../css_types/scalar.md) to determine the vertical length of the widget.
+The style `height` needs a [``](../../css_types/scalar) to determine the vertical length of the widget.
By default, it sets the height of the content area, but if [`box-sizing`](./box_sizing) is set to `border-box` it sets the height of the border area.
### Values
diff --git a/docs/styles/layer.md b/docs/styles/layer.md
index 27492311c..6e6f02476 100644
--- a/docs/styles/layer.md
+++ b/docs/styles/layer.md
@@ -5,11 +5,11 @@ The `layer` property defines the layer a widget belongs to.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-layer: <name>;
+layer: <name>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `layer` rule accepts a [``](../css_types/name.md) that defines the layer this widget belongs to.
-This [``](../css_types/name.md) must correspond to a [``](../css_types/name.md) that has been defined in a [`layers`](./layers.md) rule by an ancestor of this widget.
+The `layer` rule accepts a [``](../../css_types/name) that defines the layer this widget belongs to.
+This [``](../../css_types/name) must correspond to a [``](../../css_types/name) that has been defined in a [`layers`](./layers) rule by an ancestor of this widget.
More information on layers can be found in the [guide](../guide/layout.md#layers).
diff --git a/docs/styles/layers.md b/docs/styles/layers.md
index af7d0766a..427d2761e 100644
--- a/docs/styles/layers.md
+++ b/docs/styles/layers.md
@@ -5,10 +5,10 @@ The `layers` property allows you to define an ordered set of layers.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-layers: <name>+;
+layers: <name>+;
--8<-- "docs/snippets/syntax_block_end.md"
-The `layers` rule accepts one or more [``](../css_types/name.md) that define the layers that the widget is aware of, and the order in which they will be painted on the screen.
+The `layers` rule accepts one or more [``](../../css_types/name) that define the layers that the widget is aware of, and the order in which they will be painted on the screen.
The values used here can later be referenced using the [`layer`](../layer) property.
The layers defined first in the list are drawn under the layers that are defined later in the list.
diff --git a/docs/styles/links/index.md b/docs/styles/links/index.md
index d8a69b555..6aea1f6da 100644
--- a/docs/styles/links/index.md
+++ b/docs/styles/links/index.md
@@ -19,17 +19,17 @@ There are a number of styles which influence the appearance of these links withi
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-background: <color> [<percentage>];
+link-background: <color> [<percentage>];
-link-color: <color> [<percentage>];
+link-color: <color> [<percentage>];
-link-style: <text-style>;
+link-style: <text-style>;
-link-hover-background: <color> [<percentage>];
+link-hover-background: <color> [<percentage>];
-link-hover-color: <color> [<percentage>];
+link-hover-color: <color> [<percentage>];
-link-hover-style: <text-style>;
+link-hover-style: <text-style>;
--8<-- "docs/snippets/syntax_block_end.md"
Visit each style's reference page to learn more about how the values are used.
diff --git a/docs/styles/links/link_background.md b/docs/styles/links/link_background.md
index 5d6b78046..92e1e6191 100644
--- a/docs/styles/links/link_background.md
+++ b/docs/styles/links/link_background.md
@@ -9,10 +9,10 @@ The `link-background` sets the background color of the link.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-background: <color> [<percentage>];
+link-background: <color> [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-`link-background` accepts a [``](../../css_types/color.md) (with an optional transparency level defined by a [``](../../css_types/percentage.md)) that is used to define the background color of text enclosed in Textual action links.
+`link-background` accepts a [``](../../../css_types/color) (with an optional transparency level defined by a [``](../../../css_types/percentage)) that is used to define the background color of text enclosed in Textual action links.
### Values
diff --git a/docs/styles/links/link_color.md b/docs/styles/links/link_color.md
index 4b537a1b2..e9ce8c210 100644
--- a/docs/styles/links/link_color.md
+++ b/docs/styles/links/link_color.md
@@ -9,10 +9,10 @@ The `link-color` sets the color of the link text.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-color: <color> [<percentage>];
+link-color: <color> [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-`link-color` accepts a [``](../../css_types/color.md) (with an optional transparency level defined by a [``](../../css_types/percentage.md)) that is used to define the color of text enclosed in Textual action links.
+`link-color` accepts a [``](../../../css_types/color) (with an optional transparency level defined by a [``](../../../css_types/percentage)) that is used to define the color of text enclosed in Textual action links.
### Values
diff --git a/docs/styles/links/link_hover_background.md b/docs/styles/links/link_hover_background.md
index 03235bb60..9da9e27c6 100644
--- a/docs/styles/links/link_hover_background.md
+++ b/docs/styles/links/link_hover_background.md
@@ -9,10 +9,10 @@ The `link-hover-background` sets the background color of the link when the mouse
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-hover-background: <color> [<percentage>];
+link-hover-background: <color> [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-`link-hover-background` accepts a [``](../../css_types/color.md) (with an optional transparency level defined by a [``](../../css_types/percentage.md)) that is used to define the background color of text enclosed in Textual action links when the mouse pointer is over it.
+`link-hover-background` accepts a [``](../../../css_types/color) (with an optional transparency level defined by a [``](../../../css_types/percentage)) that is used to define the background color of text enclosed in Textual action links when the mouse pointer is over it.
### Values
diff --git a/docs/styles/links/link_hover_color.md b/docs/styles/links/link_hover_color.md
index d04758987..a1f53c4f9 100644
--- a/docs/styles/links/link_hover_color.md
+++ b/docs/styles/links/link_hover_color.md
@@ -9,10 +9,10 @@ The `link-hover-color` sets the color of the link text when the mouse cursor is
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-hover-color: <color> [<percentage>];
+link-hover-color: <color> [<percentage>];
--8<-- "docs/snippets/syntax_block_end.md"
-`link-hover-color` accepts a [``](../../css_types/color.md) (with an optional transparency level defined by a [``](../../css_types/percentage.md)) that is used to define the color of text enclosed in Textual action links when the mouse pointer is over it.
+`link-hover-color` accepts a [``](../../../css_types/color) (with an optional transparency level defined by a [``](../../../css_types/percentage)) that is used to define the color of text enclosed in Textual action links when the mouse pointer is over it.
### Values
diff --git a/docs/styles/links/link_hover_style.md b/docs/styles/links/link_hover_style.md
index 015930c0b..3a9d429db 100644
--- a/docs/styles/links/link_hover_style.md
+++ b/docs/styles/links/link_hover_style.md
@@ -9,10 +9,10 @@ The `link-hover-style` sets the text style for the link text when the mouse curs
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-hover-style: <text-style>;
+link-hover-style: <text-style>;
--8<-- "docs/snippets/syntax_block_end.md"
-`link-hover-style` applies its [``](../../css_types/text_style.md) to the text of Textual action links when the mouse pointer is over them.
+`link-hover-style` applies its [``](../../../css_types/text_style) to the text of Textual action links when the mouse pointer is over them.
### Values
diff --git a/docs/styles/links/link_style.md b/docs/styles/links/link_style.md
index 2f37484f9..336e5a437 100644
--- a/docs/styles/links/link_style.md
+++ b/docs/styles/links/link_style.md
@@ -9,7 +9,7 @@ The `link-style` sets the text style for the link text.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-link-style: <text-style>;
+link-style: <text-style>;
--8<-- "docs/snippets/syntax_block_end.md"
`link-style` will take all the values specified and will apply that styling to text that is enclosed by a Textual action link.
diff --git a/docs/styles/margin.md b/docs/styles/margin.md
index a7543f24e..de97a31f7 100644
--- a/docs/styles/margin.md
+++ b/docs/styles/margin.md
@@ -5,25 +5,25 @@ The `margin` rule specifies spacing around a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-margin: <integer>
+margin: <integer>
# one value for all edges
- | <integer> <integer>
+ | <integer> <integer>
# top/bot left/right
- | <integer> <integer> <integer> <integer>;
+ | <integer> <integer> <integer> <integer>;
# top right bot left
-margin-top: <integer>;
-margin-right: <integer>;
-margin-bottom: <integer>;
-margin-left: <integer>;
+margin-top: <integer>;
+margin-right: <integer>;
+margin-bottom: <integer>;
+margin-left: <integer>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `margin` specifies spacing around the four edges of the widget equal to the [``](../css_types/integer.md) specified.
+The `margin` specifies spacing around the four edges of the widget equal to the [``](../../css_types/integer) specified.
The number of values given defines what edges get what margin:
- - 1 [``](../css_types/integer.md) sets the same margin for the four edges of the widget;
- - 2 [``](../css_types/integer.md) set margin for top/bottom and left/right edges, respectively.
- - 4 [``](../css_types/integer.md) set margin for the top, right, bottom, and left edges, respectively.
+ - 1 [``](../../css_types/integer) sets the same margin for the four edges of the widget;
+ - 2 [``](../../css_types/integer) set margin for top/bottom and left/right edges, respectively.
+ - 4 [``](../../css_types/integer) set margin for the top, right, bottom, and left edges, respectively.
!!! tip
diff --git a/docs/styles/max_height.md b/docs/styles/max_height.md
index b483200f4..c14162517 100644
--- a/docs/styles/max_height.md
+++ b/docs/styles/max_height.md
@@ -5,10 +5,10 @@ The `max-height` rule sets a maximum height for a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-max-height: <scalar>;
+max-height: <scalar>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `max-height` rule accepts a [``](../css_types/scalar.md) that defines an upper bound for the [`height`](./height.md) of a widget.
+The `max-height` rule accepts a [``](../../css_types/scalar) that defines an upper bound for the [`height`](./height) of a widget.
That is, the height of a widget is never allowed to exceed `max-height`.
### Values
diff --git a/docs/styles/max_width.md b/docs/styles/max_width.md
index 1682c5301..41d07b315 100644
--- a/docs/styles/max_width.md
+++ b/docs/styles/max_width.md
@@ -5,10 +5,10 @@ The `max-width` rule sets a maximum width for a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-max-width: <scalar>;
+max-width: <scalar>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `max-width` rule accepts a [``](../css_types/scalar.md) that defines an upper bound for the [`width`](./width.md) of a widget.
+The `max-width` rule accepts a [``](../../css_types/scalar) that defines an upper bound for the [`width`](./width) of a widget.
That is, the width of a widget is never allowed to exceed `max-width`.
### Values
diff --git a/docs/styles/min_height.md b/docs/styles/min_height.md
index 1279f92fb..79adb93bb 100644
--- a/docs/styles/min_height.md
+++ b/docs/styles/min_height.md
@@ -5,10 +5,10 @@ The `min-height` rule sets a minimum height for a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-min-height: <scalar>;
+min-height: <scalar>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `min-height` rule accepts a [``](../css_types/scalar.md) that defines a lower bound for the [`height`](./height.md) of a widget.
+The `min-height` rule accepts a [``](../../css_types/scalar) that defines a lower bound for the [`height`](./height) of a widget.
That is, the height of a widget is never allowed to be under `min-height`.
### Values
diff --git a/docs/styles/min_width.md b/docs/styles/min_width.md
index cd4d1899e..4db00c5e4 100644
--- a/docs/styles/min_width.md
+++ b/docs/styles/min_width.md
@@ -5,10 +5,10 @@ The `min-width` rule sets a minimum width for a widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-min-width: <scalar>;
+min-width: <scalar>;
--8<-- "docs/snippets/syntax_block_end.md"
-The `min-width` rule accepts a [``](../css_types/scalar.md) that defines a lower bound for the [`width`](./width.md) of a widget.
+The `min-width` rule accepts a [``](../../css_types/scalar) that defines a lower bound for the [`width`](./width) of a widget.
That is, the width of a widget is never allowed to be under `min-width`.
### Values
diff --git a/docs/styles/offset.md b/docs/styles/offset.md
index e8cf643d6..10ca2dd4d 100644
--- a/docs/styles/offset.md
+++ b/docs/styles/offset.md
@@ -5,13 +5,13 @@ The `offset` rule defines an offset for the position of the widget.
## Syntax
--8<-- "docs/snippets/syntax_block_start.md"
-offset: <scalar> <scalar>;
+offset: <scalar> <scalar>;
-offset-x: <scalar>;
-offset-y: <scalar>
+offset-x: <scalar>;
+offset-y: <scalar>
--8<-- "docs/snippets/syntax_block_end.md"
-The two [``](../css_types/scalar.md) in the `offset` define, respectively, the offsets in the horizontal and vertical axes for the widget.
+The two [``](../../css_types/scalar) in the `offset` define, respectively, the offsets in the horizontal and vertical axes for the widget.
To specify an offset along a single axis, you can use `offset-x` and `offset-y`.