Monday, October 22, 2012

How to wrap Label text in asp.net?


If you don't wrap Label text in page, then it will disturb display settings of page controls, because Label displays text in single line.

To solve your problem just wrap the Label, using word-break CSS.

For this follow these steps-

Step1.  On top of the page, define this CSS in style section.

<style type="text/css">
        .clsWrap
        {
            word-break: break-all;
        }
</style>


Step2.  Now set this CSS to Label control using CssClass Property.

<asp:Label ID="lblMessage" runat ="server" CssClass="clsWrap"  width="100px"></asp:Label>


Now done, after crossing 100 PX length of Label text will be in next line. Same code you can use for GridView Label control also, means if you are putting Label control inside GridView Template then use same solution.



Thanks



7 comments:

  1. Thanks a lot. Exactly search for this. Thanks Developer.

    ReplyDelete
  2. Hi - Thanks but I tried it and it did not work in IE8 running from a .Net 4.0 VS 2010 solution. I'm quite perplexed by this as I have been developing web pages for 10 years now and do not understand how I never came across this problem other than the fact that the last time I wrapped text in a Label was older versions of IE. Any other suggestions? Cheers

    ReplyDelete
  3. I'm not new to .Net...been working with it since 1.0. The info in this post is false. Unless you are emulating IE9, the word-break property is unknown. The solution is to put the label inside a table and set the table-layout property to fixed (along with your desired width)...Then set white-space to Normal on the cell where you placed the label.

    ReplyDelete
  4. hi ,
    I tried the above solution... It helped but now the problem is the words are breaking in between and are coming in other line. eg. line end at betw
    and next line is starting from een .. SO, its nt looking good .. So , I need a solution to wrap text but new word should go to next line instead of breaking the words in between.

    ReplyDelete
    Replies
    1. Hi,

      Actually work wrap is happened based on the width of text, it doesn't check for new word. wherever the width is crosses then it break the word.

      Delete