diff --git a/docs/styles/margin.md b/docs/styles/margin.md index 2bd01ba68..584657301 100644 --- a/docs/styles/margin.md +++ b/docs/styles/margin.md @@ -1,12 +1,14 @@ # Margin -The `margin` rule adds space around the entire widget. +The `margin` rule adds space around the entire widget. Margin may be specified with 1, 2 or 4 values. -- `margin: 1;` Sets a margin of 1 around all 4 edges -- `margin: 1 2;` Sets a margin of 1 on the top and bottom edges, and a margin of 2 on the left and right edges -- `margin: 1 2 3 4;` Sets a margin of one on the top edge, 2 on the right, 3 on the bottom, and 4 on the left. +| example | | +| ------------------ | ------------------------------------------------------------------- | +| `margin: 1;` | A single value sets a margin of 1 around all 4 edges | +| `margin: 1 2;` | Two values sets the margin for the top/bottom and left/right edges | +| `margin: 1 2 3 4;` | Four values sets top, right, bottom, and left margins independently | -Margin may also be set individually, following the same pattern as above, by setting `margin-top`, `margin-right`, `margin-bottom`, or `margin-left`. +Margin may also be set individually by setting `margin-top`, `margin-right`, `margin-bottom`, or `margin-left` to an single value. ## Example diff --git a/docs/styles/padding.md b/docs/styles/padding.md index 79cd51954..f8f54477b 100644 --- a/docs/styles/padding.md +++ b/docs/styles/padding.md @@ -2,11 +2,13 @@ The padding rule adds space around the content of a widget. You can specify padding with 1, 2 or 4 numbers. -- `padding: 1;` Sets a padding of 1 around all 4 edges -- `padding: 1 2;` Sets a padding of 1 on the top and bottom edges, and a padding of two on the left and right edges -- `padding: 1 2 3 4;` Sets a padding of one on the top edge, 2 on the right, 3 on the bottom, and 4 on the left. +| example | | +| ------------------- | ------------------------------------------------------------------- | +| `padding: 1;` | A single value sets a padding of 1 around all 4 edges | +| `padding: 1 2;` | Two values sets the padding for the top/bottom and left/right edges | +| `padding: 1 2 3 4;` | Four values sets top, right, bottom, and left padding independently | -Padding may also be set individually, following the same pattern as above, by setting `padding-top`, `padding-right`, `padding-bottom`, or `padding-left`. +Padding may also be set individually by setting `padding-top`, `padding-right`, `padding-bottom`, or `padding-left` to an single value. ## Example