如何在Asp Repeater中设置Bootstrap列？

Question

我正在使用Asp Repeater创建一些内容，例如图库。目前，图库显示如下。

IMG1
IMG2
IMG3
IMG4

但是我需要每行四张图像。如果超过四个，则转到新行。我可以使用此thread的解决方案来实现此目的，但是它没有响应。如何在ASP中继器中使用bootstraps col-md-4。

这是我期望的结果。

在桌面视图上。

IMG1 IMG2 IMG3 IMG4
IMG5 IMG6 IMG7 IMG8

在移动设备视图上

IMG1
IMG2
IMG3
IMG4
IMG5
...

这是我当前的html。

<table>
      <asp:Repeater id="rptTest" runat="server">
          <ItemTemplate>
               <%# (Container.ItemIndex + 5) % 5 == 0 ? "<tr>" : string.Empty %>
                   <td style="padding-right:10px;padding-bottom:20px;">
                        <div class=" col-md-12 agile_ecommerce_tab_left">
                            <div class="hs-wrapper">
                                <img src='<%# Eval("Imgthumb") %>' class="img-responsive img-thumbnail" />
                                     <div class="w3_hs_bottom">
                                          <ul>
                                            <li>
                                               <a href="#" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
                                            </li>
                                           </ul>
                                      </div>
                                 </div> 

                                 <h5><a href="single.html"><%#  Eval("Title") %></a></h5>
                                 <div class="simpleCart_shelfItem">
                                  </div>

                            </div>

                          </td>
                       <%# (Container.ItemIndex + 5) % 5 == 4 ? "</tr>" : string.Empty %>

                  </ItemTemplate>

            </asp:Repeater>
       </table>