如何在同一行显示asp:面板？

Question

下面的标记将面板一个显示在另一个下面.我想做的就是将它们紧挨着显示出来.这是标记:

<div>
    <asp:Panel ID="pnlA" runat="server">
        <img src="../images/A.png" /> 
        <asp:Literal ID="litA" runat="server" Text="A"></asp:Literal>
    </asp:Panel>
    <asp:Panel ID="pnlB" runat="server">
        <img src="../images/B.png" /> 
        <asp:Literal ID="litB" runat="server" Text="B"></asp:Literal>
    </asp:Panel>
</div>

以上显示如下:

图片A

图B

事实上,我希望它像Image A Image B.

呈现的HTML与上面几乎相同,但是面板呈现为div,因此没有内容的结构是:

<div>
    <div></div>
    <div></div>
<div>

Answer 1

Panel以HTML格式呈现为div.最简单的方法是使用CSS来覆盖div的默认行为.

<asp:Panel ID="pnlA" runat="server" style="display:inline;">
    <img src="App_Themes/TicketDeskTheme/file.gif" /> 
    <asp:Literal ID="litA" runat="server" Text="A"></asp:Literal>
</asp:Panel>
<asp:Panel ID="pnlB" runat="server" style="display:inline;">
    <img src="App_Themes/TicketDeskTheme/file.gif" /> 
    <asp:Literal ID="litB" runat="server" Text="B"></asp:Literal>
</asp:Panel>

此示例使用style属性,该属性直接传递给HTML.如果您希望在可重用的样式表中使用CssClass,则可以使用它.