1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

Forcing long text lines to wrap

Discussion in 'Web Design & Development' started by msage, Jul 13, 2004.

Thread Status:
Not open for further replies.
Advertisement
  1. msage

    msage Thread Starter

    Joined:
    Jul 13, 2004
    Messages:
    3
    Our company has rolled it's own problem management program (using Lotus Domino I think).

    Editing text in the status area works fine. But, displaying the text is a different thing. If the user allows the text to wrap in the edit box, the whole sentence/paragraph is displayed on one line that extends beyond the right side of the window.

    I've pointed out that this does not look right and asked if it was going to be fixed. The developer pretty much agreed that it's not right but, he can't figure out how to fix it. His solution was to tell the users to insert linefeeds right before the right side of the edit box.

    I've viewed the source of the generated web page. Tables are used to handle the layout. The long text entry is wrapped in <pre> </pre> tags.

    My question is: Is there a way to force long lines of text to wrap?

    I have to believe there is (via Javascript possibly). Unfortunately, I'm just learning HTML. The searches I have done on the web have turned up at least one item that might resolve this. Unfortunately, the entry is on a site that requires a paid subscription.
     
  2. Gibble

    Gibble

    Joined:
    Oct 9, 2001
    Messages:
    27,087
    Your developer can't fix it?

    Geesh...time for a new developer!

    in the css, give the pre tag these attributes
    pre {
    white-space: -moz-pre-wrap; /* Mozilla, supported since 1999 */
    white-space: -pre-wrap; /* Opera 4 - 6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* CSS3 - Text module (Candidate Recommendation) http://www.w3.org/TR/css3-text/#white-space */
    word-wrap: break-word; /* IE 5.5+ */
    }

    or in the HTML in the pre tags style attribute put

    <pre style="
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    white-space: pre-wrap;
    word-wrap: break-word;
    ">

    This should work with most browsers.
     
  3. msage

    msage Thread Starter

    Joined:
    Jul 13, 2004
    Messages:
    3
    Thank you!!

    A couple things though:

    1) Can you tell me where those values (i.e. -moz-pre-wrap) are defined? I tried searching on www.w3.org and got a little frustrated (I work on big iron--we don't use no stinkin' fancy-smancy web browsin' do-dads. :).

    2) Can the width be modified? I imagine it can be.
     
  4. Gibble

    Gibble

    Joined:
    Oct 9, 2001
    Messages:
    27,087
    1) A lot of those like -moz-pre-wrap are browser specific, that's why there are so many, there isn't a w3 standard 'yet' ...

    2) The width can be modified in the style by adding width: 50%; to it (or whatever % or absolute value.
     
  5. msage

    msage Thread Starter

    Joined:
    Jul 13, 2004
    Messages:
    3
    I appreciate your information.
     
  6. Gibble

    Gibble

    Joined:
    Oct 9, 2001
    Messages:
    27,087
    No problem
     
  7. Sponsor

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Loading...
Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/249849

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice