Nate Pet
Nate Pet

Reputation: 46322

asp:Literal control not displaying HTML properly

When using the asp:Literal control to show HTML content, it does not show up properly for me. I have used the PassThrough Mode.

    <body>
     <form id="form1" runat="server">         
        <asp:Literal ID="litPrintView" Mode="PassThrough" runat="server"></asp:Literal>  
     </form>
    </body>

In my code behind, I have the following code:

     protected void Page_Load(object sender, EventArgs e)
      {         

        StringBuilder builder = new StringBuilder();

        builder.Append("<div style='width:10%'>");
        builder.Append("<hr>");
        builder.Append("</div>");
        builder.Append("<div style='width:10%'>");
        builder.Append("<span style='white-space: nowrap;'>First1 Last1</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First2 Last2</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First3 Last3</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First4 Last4</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First5 Last5</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First6 Last6</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First7 Last7</span><span style=' margin-left:20px;'></span>");
        builder.Append("<span style='white-space: nowrap;'>First8 Last8</span><span style=' margin-left:20px;'></span>");               
        builder.Append("</div>");

        string st = builder.ToString();

        litPrintView.Text = st;
    }

The problem I am having is that when I look at the code, I generates the following:

    <div style='width:10%'><hr></div><div style='width:10%'><span style='white-space: nowrap;'>First1 Last1</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First2 Last2</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First3 Last3</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First4 Last4</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First5 Last5</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First6 Last6</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First7 Last7</span><span style=' margin-left:20px;'></span><span style='white-space: nowrap;'>First8 Last8</span><span style=' margin-left:20px;'></span></div>

When if I copy that into an html page it still shows incorrectly. The ONLY way to fix this is physically format the page and then immediately it works fine as such.

            <div style='width:10%'><hr></div>
            <div style='width:10%'>
            <span style='white-space: nowrap;'>First1 Last1</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First2 Last2</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First3 Last3</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First4 Last4</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First5 Last5</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First6 Last6</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First7 Last7</span><span style=' margin-left:20px;'></span>
            <span style='white-space: nowrap;'>First8 Last8</span><span style=' margin-left:20px;'></span>
            </div>

Upvotes: 1

Views: 674

Answers (1)

Arindam Nayak
Arindam Nayak

Reputation: 7462

Then use AppendLine instead of simple Append for stringbuilder.

Example -

builder.AppendLine("<div style='width:10%'>");
builder.AppendLine("<hr>");

Upvotes: 2

Related Questions