Rails6でBootstrapのグリッドシステムを使用したい。

Question

わからないこと

Bootstrapのグリッドシステムを使用して、Webページを縦に4つに分割し、作成したDBのデータを横並びで表示したいです。
分かる方いらっしゃいますでしょうか？

ソース

<div class="container">
  <h1 class="text-center">Room</h1>
  <% @articles.each do |article| %>
    <div class="col-sm-4 margin-change">
      <p><%= article.title %></p>
      <%= article.created_at.strftime("%Y年%-m月%-d日 %-H時%-M分%-S秒") %>
    </div>
  <% end %>
</div>

結果

containerに含んだ部分が縦に4つに分割されず、縦に連なった形に表示されます。

環境

Rails 6.0.2.1
Ruby 2.6.3
Bootstrap 4．4．1

参考

http://websae.net/twitter-bootstrap-grid-system-21060224/

Answer 1

Bootstrapのグリッドは、.rowの内部で使うものかと思います。

Grid System - Bootstrap 4.0

Comments

[T.Adams]

御回答ありがとうございます。おっしゃるとおり、rowを使用したら、グリッドシステムが適用できました。1点気になることは、rails5.1.6とbootstrap4.4.1の組み合わせの場合、rowをつけずにうまくグリッド化できました。