HTML Table Tags Pushed Below Data - Rails

Question

I thought this would be a simple task: putting <table></table> tags around an enumerating each method where it goes through the data. Here's the code:

<div id="results-panel">
    <table>
        <% @artwork_q.each_with_index do |art, index| %>
            <div class="a-result" id="<%= index %>">
                <%= art.artist.fullname %>
            </div>
        <% end %>
    </table>
</div>

The problem is that both the opening and closing <table></table> tags end up after all the data has been listed, not surrounding the data as I obviously thought it would:

I did try this with the proper <tr> and <td> tags and it still happened then. This version is for the sake of simplicity and finding the real problem. Any help is incredibly appreciated. Thank you.

Answer 1

Your table is missing TR and TD tags... that is why the browsers render the table tag outside your div's.

The following should fix it:

<div id="results-panel">
    <table>
        <tbody>
        <% @artwork_q.each_with_index do |art, index| %>
            <tr><td>
            <div class="a-result" id="<%= index %>">
                <%= art.artist.fullname %>
            </div>
            </td></tr> 
        <% end %>
        </tbody>
    </table>
</div>