c# - CSS 不在转发器内格式化

Question

我正在尝试在转发器中使用 css。当我运行它时，没有格式。但是，当我在中继器外使用 css 时，它的格式很好。

<style>
   body {
       background-color:lightgray
   }
   .messageBox p  {
        background-color:white;
        width: 25%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
   }
</style>

外部中继器

<div class="messageBox">
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
</div>

中继器内部

<asp:Repeater ID="myRepeater" runat="server">
    <ItemTemplate>
        <br />
        <div class="messageBox">
            <p>
                <%# Eval("Message") %>                            
            </p>
        </div>
    </ItemTemplate>
</asp:Repeater>

Answer 1

你需要移动<div class="messageBox">到 HeaderTemplate或在中继器和关闭之前 </div>到 FooterTemplate或者在转发器的末尾。

最终结果应该是这样的:

<asp:Repeater ID="myRepeater" runat="server">
    <HeaderTemplate>
        <div class="messageBox">
    </HeaderTemplate>
    <ItemTemplate>
        <br />
        <p>
            <%# Eval("Message") %>                            
        </p>
    </ItemTemplate>
    <FooterTemplate>
        </div>
    </FooterTemplate>
</asp:Repeater>

或:

<div class="messageBox">
    <asp:Repeater ID="myRepeater" runat="server">       
        <ItemTemplate>
            <br />
            <p>
                <%# Eval("Message") %>                            
            </p>
        </ItemTemplate>     
    </asp:Repeater>
</div>

我喜欢第一种方法，因为它不会留空 div如果没有数据元素。