ブートストラップ：のボックスを分割する3の

Question

現在、私は、このようなHTMLのthatsのブロックを持っている：

<div class="info-box-content"> 
    <span class="info-box-text">CPU Traffic</span> 
    <span class="info-box-number">{!! $cpuUseage !!}<small>%</small></span> 
</div> 

上のボックスは現在このように表示される - hereを見られるように：

ボックスを3つの別々のボックスに分割すると、1つのボックス内にもっと詳しい知識のある統計情報を表示できますか？

Answer 1

使用Bootstrap grid systemです。

<div class="info-box-content row"> 
    <div class="col-md-4"> 
    <span class="info-box-text">CPU Traffic</span> 
    <span class="info-box-number">10<small>%</small></span> 
    </div> 
    <div class="col-md-4"> 
    <span class="info-box-text">RAM Traffic</span> 
    <span class="info-box-number">50<small>%</small></span> 
    </div> 
    <div class="col-md-4"> 
    <span class="info-box-text">HDD Traffic</span> 
    <span class="info-box-number">90<small>%</small></span> 
    </div> 
</div> 

Answer 2

グリッドを使用する必要があります。ここで有用なリンク

https://getbootstrap.com/examples/grid/