diff options
| author | Mark Otto <[email protected]> | 2016-09-08 22:16:28 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2016-09-08 22:16:28 -0700 |
| commit | 0be876359ed4ed7c8a3d315a6ef9a04eede8d765 (patch) | |
| tree | e581144cab3da2959274f18206c2f01a14fee50d /docs/utilities | |
| parent | ae784c9521101c391ecc98e906ddf18e6aeb459b (diff) | |
| download | bootstrap-0be876359ed4ed7c8a3d315a6ef9a04eede8d765.tar.xz bootstrap-0be876359ed4ed7c8a3d315a6ef9a04eede8d765.zip | |
Update docs to use new spacing util class names
Diffstat (limited to 'docs/utilities')
| -rw-r--r-- | docs/utilities/spacing.md | 16 |
1 files changed, 8 insertions, 8 deletions
diff --git a/docs/utilities/spacing.md b/docs/utilities/spacing.md index 045c4b213..1ee1ab7fb 100644 --- a/docs/utilities/spacing.md +++ b/docs/utilities/spacing.md @@ -6,7 +6,7 @@ group: utilities Assign `margin` or `padding` to an element or a subset of its sides with shorthand classes. Includes support for individual properties, all properties, and vertical and horizontal properties. All classes are multiples on the global default value, `1rem`. -The classes are named using the format: `{property}-{sides}-{size}` +The classes are named using the format: `{property}{sides}-{size}` Where *property* is one of: @@ -35,35 +35,35 @@ Where *size* is one of: Here are some representative examples of these classes: {% highlight scss %} -.m-t-0 { +.mt-0 { margin-top: 0 !important; } -.m-l-1 { +.ml-1 { margin-left: $spacer-x !important; } -.p-x-2 { +.px-2 { padding-left: ($spacer-x * 1.5) !important; padding-right: ($spacer-x * 1.5) !important; } -.p-a-3 { +.p-3 { padding: ($spacer-y * 3) ($spacer-x * 3) !important; } {% endhighlight %} ### Horizontal centering -Additionally, Bootstrap also includes an `.m-x-auto` class for horizontally centering fixed-width block level content by setting the horizontal margins to `auto`. +Additionally, Bootstrap also includes an `.mx-auto` class for horizontally centering fixed-width block level content by setting the horizontal margins to `auto`. <div class="bd-example"> - <div class="m-x-auto" style="width: 200px; background-color: rgba(86,61,124,.15);"> + <div class="mx-auto" style="width: 200px; background-color: rgba(86,61,124,.15);"> Centered element </div> </div> {% highlight html %} -<div class="m-x-auto" style="width: 200px;"> +<div class="mx-auto" style="width: 200px;"> Centered element </div> {% endhighlight %} |
