asp.net - 如何在转发器中以正确的表格格式放置内容？

Question

我有一个这样的中继器

<ul>
                    <li>
                        <div class="product">
                            <a href="#" class="info">
                                <table class="holder">
                                    <asp:Repeater ID="repContent" runat="server">
                                        <HeaderTemplate></HeaderTemplate>
                                        <ItemTemplate>

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

                                 <td>
                                    <img src='<%#"/productimages/main/" + Eval("PhotoName").ToString().Trim()  %>' alt="No Image" />
                                    <span class="book-name"><%#Eval("ProductName") %></span>
                                    <span class="author">by <%#Eval("CompanyName") %></span>
                                    <span class="description"><%#Eval("Description") %></span>

                                  </td>

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

                                            </ItemTemplate>
                                            <FooterTemplate></FooterTemplate>
                                         </asp:Repeater>
                                 </table>
                            </a>
                            <a href="#" class="buy-btn">BUY NOW <span class="price"><span class="low">$</span>22<span class="high">00</span></span></a>
                        </div>
                    </li>                   
                </ul>

并且它在浏览器中出现这样

请告诉我我应该对我的代码进行哪些操作。

Answer 1

忽略这段 HTML 完全无效的事实（ul -> li -> div -> a -> table），尝试将单元格垂直对齐设置为顶部（<td valign="top">）。

一个很好的建议。尝试使用 CSS 并仅使用 div 重写它并使其有效。

<ul>
    <li>
        <div class="product">
            <a href="#" class="info">
                <table class="holder">
                    <asp:Repeater ID="repContent" runat="server">
                        <ItemTemplate>
                              <%# (Container.ItemIndex + 4) % 4 == 0 ? "<tr>" : string.Empty %>
                                  <td valign="top">
                                      <img src='<%#"/productimages/main/" + Eval("PhotoName").ToString().Trim()  %>' alt="No Image" />
                                      <span class="book-name"><%#Eval("ProductName") %></span>
                                      <span class="author">by <%#Eval("CompanyName") %></span>
                                      <span class="description"><%#Eval("Description") %></span>
                                  </td>
                              <%# (Container.ItemIndex + 4) % 4 == 3 ? "</tr>" : string.Empty %>
                          </ItemTemplate>                      
                      </asp:Repeater>
                  </table>
              </a>
              <a href="#" class="buy-btn">BUY NOW <span class="price"><span class="low">$</span>22<span class="high">00</span></span></a>
        </div>
    </li>
</ul>