Adding Html from Code Behind in Asp.net

Question

I want to add HTML structure and control like this from code behind into a panel

<div class='Main'>
    <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>
    <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>        <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>
    <div class='end'>
    </div>
</div>

  <asp:Panel runat="server" CssClass="sxpnl" ID="pnlUserdata">
        </asp:Panel>

If i try to add like this

 HtmlGenericControl divcontrol = new HtmlGenericControl();
 divcontrol.Attributes["class"] = "sxro sx1co";
 divcontrol.TagName = "div";
 pnlUserSearch.Controls.Add(divcontrol);
 Label question = new Label();
 questionDescription.Text = "text";
 pnlUserSearch.Controls.Add(question);

It will add controls one after another, how can i make controls go nested like that as shown above.

Answer 1

Don't add that child control to the panel, add it to the control that should be the parent:

HtmlGenericControl divcontrol = new HtmlGenericControl();
divcontrol.Attributes["class"] = "sxro sx1co";
divcontrol.TagName = "div";
pnlUserSearch.Controls.Add(divcontrol);
Label question = new Label();
questionDescription.Text = "text";
divcontrol.Controls.Add(question); // add to the new div, not to the panel

Answer 2

For appending HTML to your panel, add a LiteralControl control to your panel:

string yourHTMLstring = "<div class='Main'>....";
pnlUserdata.Controls.Add(new LiteralControl(yourHTMLstring));

Answer 3

<div id="Div1" runat="server">

Div1.InnerText = "Text";

Answer 4

Make the div runat="server"

<div id="d" runat="server"></div>

and add the controls inside div like below

d.Controls.Add();

Answer 5

1. Take one local string variable TEMP.
2. Create same html as you want to display on screen and store it in variable TEMP.
3. You can take html creation of control in separate function based on requirement.
4. Place that created html as innerHTML to your panel/div.

That's it...