列中的引导列,用于在对象上进行迭代

时间:2014-08-28 01:07:56

标签: html css twitter-bootstrap ruby-on-rails-4 multiple-columns

我想在另一个bootstrap列中创建一对bootstrap列。

由于某些原因,我的输出并不理想。他们出于某种原因看起来完全傻了。我的格式化中是否出现了菜鸟错误?

我在@user对象上进行迭代,左侧是个人资料图片,右侧是个人资料信息。有许多用户因此理想情况下应该为数据库中用户的所有迭代设置样式。

我觉得这段代码应该有用,但它不会对发生的事情有任何想法:

<div class="row">

    <div class="other-box col-sm-6">
        <p>Random text!!!</p>
    </div>

    <div class="index-user-container col-sm-6">
        <div class="row">
            <% @users.each do |user| %>
                <div class="index-picture col-sm-4">
                    <%= image_tag user.image.thumb('150x185#').url if user.image_stored? %>
                </div>
                <div class="index-info-box col-sm-8">
                    <%= user.first_name %>
                    <%= user.last_name %>
                    <%= user.email %>
                    <%= link_to 'Go to profile', user_path(@user) %>
                </div>    
            <% end %>
        </div>
    </div>

</div>

我正在使用twitter bootstrap。这是一个傻瓜的屏幕截图: enter image description here

1 个答案:

答案 0 :(得分:1)

如果你想为列表中的每个用户创建一个新行,那么将迭代器放在行div上方,而不是在其中 - 否则,你可能会得到一些时髦的结果。

<div class="index-user-container col-sm-6">
   <% @users.each do |user| %>
      <div class="row">
            <div class="index-picture col-sm-4">
                <%= image_tag user.image.thumb('150x185#').url if user.image_stored? %>
            </div>
            <div class="index-info-box col-sm-8">
                <%= user.first_name %>
                <%= user.last_name %>
                <%= user.email %>
                <%= link_to 'Go to profile', user_path(@user) %>
            </div>
    </div>
  <% end %>
</div>
相关问题