SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2006
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Wink How to word wrap a table/cell in ASP?

    Hi All,

    I have a Ajax application that I just took over, and one of the changes I need to make, is to prevent one of the string value from effecting the display of the page. When a user enters data longer 50chars, it will mess up my page layout because its trying to display the data on one line instead of automatically wrapping, when I build my display table in ASP. Any ideas on how I can resolve this? The following is an example of my code.

    string labelTitle = "Share Folder Name:";
    string ctrlValue = "LongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWordLongWord";


    TableRow r = new TableRow();
    TableCell c1 = new TableCell();
    TableCell c2 = new TableCell();
    TableCell c3 = new TableCell();

    c1.VerticalAlign = VerticalAlign.Top;
    c2.HorizontalAlign = HorizontalAlign.Left;
    c3.HorizontalAlign = HorizontalAlign.Left;

    c1.Width = new Unit(75, UnitType.Point);
    c2.Width = new Unit(200, UnitType.Point);
    c3.Width = new Unit(200, UnitType.Point);

    c2.Controls.Add(new LiteralControl(labelTitle));
    c3.Controls.Add(new LiteralControl(ctrlValue));

    r.Cells.Add(c1);
    r.Cells.Add(c2);
    r.Cells.Add(c3);


    My css file has the following.....
    body
    {
    color: black;
    font-family: Arial;
    background-color:#006281;

    }

    .standardText
    {
    color: black;
    font-family: Arial;
    background-color:#006281;
    font-size: 12px;
    font-weight:normal;
    }

    #sectionCellWhite{
    background-color:#ffffff;
    border:solid 0px #222222;
    padding-bottom:20px;
    }

    #sectionCellGray{
    background-color:#f5f5f5;
    border:solid 0px #222222;
    padding-bottom:20px;
    }

    #wideTable
    {
    width: 100%;
    border: solid 0px #222222;
    }

    #tableMargin
    {
    margin-left:15px;
    }

    .sectionTitle
    {
    FONT-WEIGHT: bold;
    FONT-SIZE: large;
    COLOR: white;
    TEXT-INDENT: 10px;
    PADDING-TOP: 6px;
    HEIGHT: 25px;
    BACKGROUND-COLOR: green;
    TEXT-ALIGN: left;
    FONT-VARIANT: small-caps
    }

    .stepCurrent
    {
    background-color: #e01122;

    width: 15px;
    border: 1px solid #e01122;
    color: White;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    }



    .sectionSubtitle
    {
    font-weight: bold;
    font-size: 1em;
    text-transform: capitalize;
    color: black;
    font-variant: normal;
    }
    .itemHeader
    {
    font-weight: bold;
    font-size: 1.3em;
    color: black;
    }

    .itemLabel
    {
    font-weight: 500;
    font-size: 1.0em;
    color: black;
    }

    .emphasis
    {
    font-weight:normal;
    font-size: 0.8em;
    color:red;
    font-variant:normal;
    }

    .note
    {
    font-weight:bolder;
    font-size: 0.7em;
    color:maroon;
    font-variant:normal;
    font-style:italic;
    }

    .formLabel
    {
    font-weight: 500;
    font-size: 0.9em;
    color: black;
    }


    .modalBackground {
    background-color:#333333;
    filter:alpha(opacity=70);
    opacity:0.7px;
    padding:5px;
    }


    .sideBar
    {
    color:White;
    padding-bottom: 10px;

    }

    .footer
    {
    font-size-small;
    color:GrayText;
    }



    .modalBackground2{
    background-color:#CCCCFF;
    filter:alpha(opacity=40);
    opacity:0.5;
    }

    .ModalWindow2{
    border: solid1px#c0c0c0;
    background:#f0f0f0;
    padding: 0px10px10px10px;
    position:absolute;
    top:-1000px;
    }




    ASP 2.0 SP2
    VS 2005 Pro

  2. #2
    Chopped Liver bronze trophy imaginekitty's Avatar
    Join Date
    Aug 2007
    Location
    Pennsyltucky
    Posts
    1,494
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    I think you'd get a better response in the CSS forum for this question.

  3. #3
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't think you will be able to wordwrap I text which has no space in it. A table by default has auto wrap. So when the width is goes beyond over what you state, the text is automatically wrapped. If course it can't be autowrapped if the text has no space in it.

  4. #4
    Non-Member
    Join Date
    Nov 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    create a CSS class as

    .leftcol{
    float:left;
    width: 250px;
    margin-bottom:10px;
    word-wrap: break-word;
    }

    and use below lines of code to call the css class on page levele.

    c3.Attributes.Add("Class", "leftcol");


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •