really fix those outline buttons

1 files changed, 6 insertions, 6 deletions

diff --git a/docs/components/buttons.md b/docs/components/buttons.md
index 95e3a14c2..e1244fe8b 100644
--- a/docs/components/buttons.md
+++ b/docs/components/buttons.md
@@ -56,14 +56,14 @@ When using button classes on `<a>` elements that are used to trigger in-page fun
 
 ## Outline buttons
 
-In need of a button, but not the hefty background colors they bring? Add the `.btn-outline` modifier class to remove all background images and colors on any button.
+In need of a button, but not the hefty background colors they bring? Replace the default modifier classes with the `.btn-outline-*` ones to remove all background images and colors on any button.
 
 {% example html %}
-<button type="button" class="btn btn-primary btn-outline">Primary</button>
-<button type="button" class="btn btn-secondary btn-outline">Secondary</button>
-<button type="button" class="btn btn-success btn-outline">Success</button>
-<button type="button" class="btn btn-warning btn-outline">Warning</button>
-<button type="button" class="btn btn-danger btn-outline">Danger</button>
+<button type="button" class="btn btn-primary-outline">Primary</button>
+<button type="button" class="btn btn-secondary-outline">Secondary</button>
+<button type="button" class="btn btn-success-outline">Success</button>
+<button type="button" class="btn btn-warning-outline">Warning</button>
+<button type="button" class="btn btn-danger-outline">Danger</button>
 {% endexample %}