Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2005
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    break or wrap words problem with HTML Div element

    Buddies,
    I have an asp.net page on which I use an HTML Div element to hold text words. The Div is has style attribute like
    style="overflow:auto; border: solid 1px #000000; width:350px; height:100px; word-break:break-all;"

    The "word-break" style just works with IE not FireFox because it is not a standard one. However, that style does not bring my page word breaks as I expect. The problem is seen as follows for words in the Div (sample words in the Div were split not properly or not into consecutive characters):

    He was planned long in advance and that he would talk wi
    th coal mine leaders about their disputed retirement progr
    am, although he stressed the original purpose of the tr
    ip was to discuss issues affecting states bordering on th
    e Atlantic.

    Please give me some solutions such that
    1/ I am able to let the HTML Div element break properly a whole word instead of some letters of that word. (For example, word "with" on the first line should be go to the second line entirely. Similarly, the word "program" on the second line should go entirely to the third line. And so on.)

    2/ Please give me a browser-cross solution.

    3/ I am able to make the HTML Div editable instead of reading-only at present.

    Thanks so much in advance.

  • #2
    Regular Coder ArcticFox's Avatar
    Join Date
    Jan 2004
    Location
    Vostok Station, AQ
    Posts
    602
    Thanks
    35
    Thanked 3 Times in 3 Posts
    Have you tried:

    style="overflow:auto; border: solid 1px #000000; width:350px; height:100px; text-align:justify;"


    I guess I don't understand why you're even using word-break:break-all;.
    <div> - putting your mind in a box since 1997

  • #3
    New to the CF scene
    Join Date
    Jun 2005
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy

    Quote Originally Posted by ArcticFox View Post
    Have you tried:

    style="overflow:auto; border: solid 1px #000000; width:350px; height:100px; text-align:justify;"


    I guess I don't understand why you're even using word-break:break-all;.
    Hi ArcticFox,
    I tried using "text-align:justify" but the problem was worse; that means there was no wrap word. Any other idea?
    Thank in advance.

  • #4
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just use this style alone. Remove word break & Overflow

    border: solid 1px #000000; width:350px; height:100px;


  •  

    Posting Permissions

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