From 0153f7d8cda74ab2bcdddc8a3dcfed8436040969 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Sun, 8 Jul 2018 17:28:37 -0700
Subject: [PATCH] add docs

---
 docs/4.1/utilities/spacing.md | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/docs/4.1/utilities/spacing.md b/docs/4.1/utilities/spacing.md
index b374748e03..dad1c00852 100644
--- a/docs/4.1/utilities/spacing.md
+++ b/docs/4.1/utilities/spacing.md
@@ -81,3 +81,25 @@ Additionally, Bootstrap also includes an `.mx-auto` class for horizontally cente
   Centered element
 </div>
 {% endhighlight %}
+
+### Negative margin
+
+In CSS, `margin` properties can utilize negative values (`padding` cannot). As of 4.2, we've added negative margin utilities for every non-zero integer size listed above (e.g., `1`, `2`, `3`, `4`, `5`). These utilities are ideal for customizing grid column gutters across breakpoints.
+
+The syntax is nearly the same as the default, positive margin utilities, but with the addition of `n` before the requested size. Here's an example class that's the opposite of `.mt-1`:
+
+{% highlight scss %}
+.mt-n1 {
+  margin-top: -0.25rem !important;
+}
+{% endhighlight %}
+
+Here's an example of customizing the Bootstrap grid at the medium (`md`) breakpoint and above. We've increased the `.col` padding with `.px-md-5` and then counteracted that with `.mx-md-n5` on the parent `.row`.
+
+{% capture example %}
+<div class="row mx-md-n5">
+  <div class="col py-3 px-md-5 border bg-light">Custom column padding</div>
+  <div class="col py-3 px-md-5 border bg-light">Custom column padding</div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}