एएसपी कैसे प्रदर्शित करें: समान रेखा पर पैनल?

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> 

ऊपर वर्तमान में इतना है कि यह प्रदर्शित करता है::

छवि एक

छवि बी

जब वास्तव में, मैं यह छवि एक छवि बी

की तरह चाहते हैं यहाँ मार्कअप है

प्रस्तुत किया गया HTML उपरोक्त जैसा ही है, लेकिन पैनलों को divs के रूप में प्रस्तुत किया जाता है, इसलिए अंदर सब कुछ के बिना संरचना है:

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

Answer 1

एक पैनल के रूप में एक div HTML में renders होगा। Divs के डिफ़ॉल्ट व्यवहार को ओवरराइड करने के लिए केवल सीएसएस का उपयोग करना सबसे आसान तरीका है।

<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> 

यह उदाहरण शैली विशेषता का उपयोग करता है, जो सीधे HTML पर पास हो जाता है। यदि आप इसे पुन: प्रयोज्य स्टाइलशीट में करना चाहते हैं तो आप CssClass का उपयोग कर सकते हैं।

Answer 2

एएसपी: पैनल, एक DIV के रूप में प्रस्तुत करना this answer की जाँच करें और देखें कि यह काम करता है