所以我使用的是Rails 5和'bootstrap','4.0.0.alpha3'。我使用Bootstrap卡和我的卡的大小是col-lg-6。我试图做的虽然是大屏幕我喜欢的帖子旋转不同的大小。现在我的索引页面上的帖子看起来像这样
col-lg-6 col-lg-6
col-lg-6 col-lg-6
col-lg-6 col-lg-6
col-lg-6 col-lg-6
依旧等等。
所以我试图添加一些基本的样式,我希望它看起来像是更多的帖子在我的索引上显示这样的东西。
col-lg-12
col-lg-6 col-lg-6
col-lg-12
col-lg-6 col-lg-6
col-lg-12
col-lg-6 col-lg-6
所以基本上我正在寻找两种不同的卡片尺寸,我只是不确定如何让它们正常工作。如果你们都需要查看代码,我很乐意添加它。
这是_post.html.erb
<div class='col-lg-6'>
<div class="card">
<%= link_to post do %>
<div class="card-topper" style='background-image: url(<%=post.banner_image_url %>);'></div>
<% end %>
<div class="card-block">
<h4 class="card-title"><%= link_to post.title, post %></h4>
<p class='tags'><%= raw post.tags.map { |t| link_to t.name, posts_path(tag: t.name) }.join(', ') %></p>
<h6 class="published-date"><%= post.display_day_published %></h6>
<%= link_to post do %>
<p class="card-text"><%= truncate(post.description, length: 130) %></p>
<% end %>
</div>
</div>
</div>