ブートストラップクラスのボタン間のスペース

Question

私のサイトの3つのボタンに問題があります。 これらのボタンの間にスペースを入れたいと思います。 インラインスタイルを使用せずにこれを行うことは可能ですか？ おそらくブートストラップにはいくつかのクラスがありますか？

私は単純にそれを行うことができます知っている：

style='margin-right:5px;' 

またはこのプロパティを持つカスタムクラスを記述します。

ブートストラップにいくつかのクラスがあるのか​​どうか疑問に思っていますか？

Hereです。

問題は、この三つのボタンである。

<button type="button" class="btn btn-primary col-sm-1">1/2</button> 
<button type="button" class="btn btn-primary col-sm-1">1/2</button> 
<button type="button" class="btn btn-primary col-sm-1">1/2</button> 

Answer 1

はい、あなたはおそらく、あなたは、カスタムスタイルを使用せずに解決策を知っている彼らに

<div class="btn-group"> 
<button type="button" class="btn btn-primary">1/2</button> 
</div> 
<div class="btn-group"> 
<button type="button" class="btn btn-primary">1/2</button> 
</div> 
<div class="btn-group"> 
<button type="button" class="btn btn-primary">1/2</button> 
</div> 

EDITED CODEPEN

Answer 2

は、BTN-ツールバーまたは他のいくつかのコンテナ内に置くようにしてください。

<div class="btn-toolbar"> 
    <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
    <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
    <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
</div> 

Answer 3

<div class="btn-toolbar"> 
 
     <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
 
     <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
 
     <button type="button" class="btn btn-primary col-sm-1">1/2</button> 
 
    </div>