Button spacing issue

[skolasbn]

I'm having issues with default button spacing - my button's are smashed together like this:

but i'd like them to look like the examples on this site

Not sure what's causing this. Thanks!

[tmorehouse]

Buttons do not have margins. You can do one of two things. Add a space between the buttons (but Vue may remove the white-space when compiling the template), or add a margin spacing utility class to the buttons"

<div>
  <b-button class="mr-1">Button</b-button>
  <b-button class="mr-1">Button</b-button>
  <b-button class="mr-1">Button</b-button>
  <b-button>Button</b-button>
</div>

[skolasbn]

Thanks @tmorehouse - I was hoping that it would add the spacing automatically - as i didnt see any classes on the example and its a pain to remember - i know i can add default spacing with a css rule. Mostly was just trying to figure out why the site examples had a space and my app doesnt.

[tmorehouse]

The docs are using the full version of Vue (using the built in Vue template compiler). Whereas I am guessing you are using Single File Components and Vue loader (which, by default, removes white-space between tags).

[skolasbn]

Ah! Thank you :)