I'm trying to figure out how to align my rails output into 3 columns of equal length using bootstrap. Basically i need three columns, the issue is that if I have 12 "skills" i would like them to be divided up into 4 skills in each section, etc...
But I can't figure out how to output the data in anything but a one column list. I'm thinking I need something like this?
<div class="col-md-4"> < ... output of skills > </div> <div class="col-md-4"> < ... output of skills > </div> <div class="col-md-4"> < ... output of skills > </div>
This is my current output that makes a list, I would like to somehow make 3 columns out of the output.
<div class="col-md-12"> <table> <!-- one-to-many association to loop through a users skills --> <% @user.skills.each do |skill| %> <tr> <td> <br /> <h4><b><%= link_to skill.name, edit_user_skill_path(user_id: @user.id, id: skill.id) %></b></h4> </td> </tr> <% end %> </table> </div>
update here's the solution I implemented based off of martin's suggestion.
<% @user.skills.in_groups_of(3, false).each do |group| %> <div class='row'> <% group.each do |skill| %> <div class='col-md-4'> <div><%= skill.name %></div><br /> </div> <% end %> </div> <% end %>
also because the text was being displayed within a panel i found that it was running off the edge so had to use this for the CSS
.panel-body{ word-wrap: break-word; }