title: Strings versus controls in ASP.NET WebForms
body: <p>why can images not be appended to a div in asp?</p>
  
  <pre><code>divHtml.append(img);
  </code></pre>
  
  <p>why do I have to use <code>div.controls.add(img);</code>?</p>
  
  <p>and why cant I add a string to controls.add say like this</p>
  
  <pre><code>div.controls.add(img + String.Format("{0}", reader.GetString(0));
  </code></pre>
  
  <p>?
  Orginally "In the beginning" </p>
  
  <p>I had this code:</p>
  
  <pre><code>    cn.Open();
      using (OdbcCommand cmd = new OdbcCommand("SELECT Wallpostings FROM WallPosting WHERE UserID=" + theUserId + " ORDER BY idWallPosting DESC", cn))
  
      using (OdbcDataReader reader = cmd.ExecuteReader())
      {
          var divHtml = new System.Text.StringBuilder();
          while (reader.Read())
          {
              divHtml.Append("&lt;div id=test&gt;");
              divHtml.Append(String.Format("{0}", reader.GetString(0)));
              divHtml.Append("&lt;/div&gt;");
          }
  
  
          test1.InnerHtml = divHtml.ToString();
  
      }
  }
  </code></pre>
  
  <p>}</p>
  
  <p>Which gave me this out put (notice the css is applied and all spacing etc is nice and neat:</p>
  
  <p><img src="https://i.stack.imgur.com/LTLRG.jpg" alt="enter image description here"></p>
  
  <p>Then I did this code:</p>
  
  <pre><code>            while (reader.Read())
              {
                  System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                  //div.ID = "test";
                  div.Style["float"] = "left";
                  Image img = new Image();
                  img.ImageUrl = "~/userdata/2/uploadedimage/batman-for-facebook.jpg";
                  img.AlternateText = "Test image";
                  div.Controls.Add(img);
                  test1.Controls.Add(div);
  
                  System.Web.UI.HtmlControls.HtmlGenericControl div1 = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                  //div1.ID = "test";
                  div1.InnerText = String.Format("{0}", reader.GetString(0));
  
                  div1.Style["float"] = "left";
                  test1.Controls.Add(div1);
  
                  System.Web.UI.HtmlControls.HtmlGenericControl div2 = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                  //div2.ID = "test";
                  div2.Style["clear"] = "both";
                  test1.Controls.Add(div2);
              }
          }
      }
  }
  </code></pre>
  
  <p>}</p>
  
  <p>And this was my result which is ok but if you notice carefully there is no css between each comment the divs are outside the realm of my css I tryed applying the commented out lines to see if it would work but its just abit funky tbh. Specialy when you look at it in firebug:</p>
  
  <p><img src="https://i.stack.imgur.com/Fdh2Q.jpg" alt="enter image description here">
  This is what happens if I try parse the control using the method mentioned below:</p>
  
  <pre><code>    cn.Open();
      using (OdbcCommand cmd = new OdbcCommand("SELECT Wallpostings FROM WallPosting WHERE UserID=" + userId + " ORDER BY idWallPosting DESC", cn))
      {
          using (OdbcDataReader reader = cmd.ExecuteReader())
          {
              test1.Controls.Clear();
  
              while (reader.Read())
              {
                  System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
  
                  div.ID = "test";
                  div.Style["float"] = "left";
                  Image img = new Image();
                  img.ImageUrl = "~/userdata/2/uploadedimage/batman-for-facebook.jpg";
                  img.AlternateText = "Test image";
  
                  div.Controls.Add(img);
                  div.Controls.Add(ParseControl(String.Format("{0}", reader.GetString(0))); 
  
                  test1.Controls.Add(div);
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/MSudO.jpg" alt="enter image description here"></p>
  
  <p>Edit:</p>
  
  <pre><code>        using (OdbcDataReader reader = cmd.ExecuteReader())
          {
              test1.Controls.Clear();
  
              while (reader.Read())
              {
          System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
          div.Attributes["class"] = "test";
          div.Style["float"] = "left";
  
          div.ID = "test";
          //div.Style["float"] = "left";
          Image img = new Image();
          img.ImageUrl = "~/userdata/2/uploadedimage/batman-for-facebook.jpg";
          img.AlternateText = "Test image";
  
          div.Controls.Add(img);
          div.Controls.Add(ParseControl(String.Format("{0}", reader.GetString(0)))); 
  
          test1.Controls.Add(div);
  </code></pre>
  
  <p>Shadow managed to get this to work and I used the parse from the other comment aswell.</p>
  
  <p>But problem remains now with test1 div not expanding with test divs:</p>
  
  <p><img src="https://i.stack.imgur.com/9IFyN.jpg" alt="enter image description here"></p>
  
  <pre><code>        &lt;asp:Button ID="Button1" runat="server" Text="Post Message" Width="98px" 
              onclick="Button1_Click" /&gt;
          &lt;/p&gt;
      &lt;p&gt;
      &lt;/p&gt;
          &lt;div id="test1" runat="server" /&gt;
  //could be this line
      &lt;/asp:Content&gt;
  </code></pre>
  
  <p>Or it could be </p>
  
  <pre><code>test1.Controls.Add(div); 
  </code></pre>
  
  <p>in my code thats not being picked up or in the correct brackets maybe?
  css: </p>
  
  <pre><code>div#test1 
  {
  
  }
  div .test
  {
    width:90%; 
    z-index:1; 
    padding:27.5px; 
    border-top: thin solid #736F6E;
    border-bottom: thin solid #736F6E;
    color:#ffffff;
    margin:0 auto;
    white-space: pre;
    white-space: pre-wrap;
    white-space: pre-line;
    word-wrap: break-word;
  }
  </code></pre>