1. Div
    1. IE
      1. white-space:normal (standard)

        Example:

        #wrapDiv{white-space:normal; width:100px; }

        <div id="wrapDiv">timeislifetimeislifetimeislifetimeislifetimeislifetimeislife</div>

      2. word-break:break-all(got from Word)

        Example:

        #wrapDiv{ word-break:break-all; width:100px; }

        <div id="wrapDiv">timeislifetimeislifetimeislifetimeislifetimeislifetimeislife</div>

    2. FireFox

      There is no better solution, the solution is similar to IE, just add a overflow:hidden or overflow:auto. For instance:

      1.  

        #wrapDiv{white-space:normal; width:100px; overflow:hidden }

        <div id="wrapDiv">timeislifetimeislifetimeislifetimeislifetimeislifetimeislife</div>

      2.  

        #wrapDiv{ word-break:break-all; width:100px; overflow:hidden }

        <div id="wrapDiv">timeislifetimeislifetimeislifetimeislifetimeislifetimeislife</div>

       

  2. Table
    1. IE: table-layout:fixed + nowrap(optional)
      1. Example1:

        <style type="text/css">

        .TableAutoWrap1

        {

            table-layout:fixed;

        }

         

        </style>

         

        <table class="TableAutoWrap1" width="100">

        <tr><td>

        </td>timeislifetimeislifetimeislife are you sure</tr>

        </table>

      2. Example2:

        <style type="text/css">

        .TableAutoWrap1

        {

            table-layout:fixed;

        }

         

        </style>

         

        <table class="TableAutoWrap1" width="100">

        <tr><td>

        </td nowrap>timeislifetimeis lifetimeis lifeareyousure</tr>

        </table>

      3. Example3:

        <style type="text/css">

        .TableAutoWrap1

        {

            table-layout:fixed;

        }

         

        </style>

         

        <body>

         

        <table class="TableAutoWrap1" width="100">

        <tr><td>

        </td nowrap width="50%">timeislife timeis lifetimeis lifeareyousure<td></td></tr>

        </table>

    2. FireFox: table-layout:fixed + nowrap(optional) + div

      So far, there is no good solution for Fixfox, the only workaround is to hide the overflowed text, and the td's width must use percentage instead of absolute width.

      For example:

      <style>

      .tableAutoWrap {table-layout:fixed}

      .td1 {overflow:hidden;}

      </style>

       

      <table class="tableAutoWrap" width=80>

      <tr><td width=25% class="td1" nowrap>

      <div>ttimeislifetimeislifet imeislifeimeislife</div>

      </td>

      <td class="td1" nowrap><div>ttimeislifetimeislifet imeislifeimeislife</div></td>

      </tr>

      </table>

       

      Note: all the foregoing solution will only be word-wrap (line-wrap) at the blank of a string of long characters, if you want to make the word-wrap occurs at every position where the length of the characters exceed the line width, you can use the following CSS element:

      <style type="text/css">

      .textarea1

      {

          overflow:hidden;

      }

      </style>

       

<textarea class="textarea1" cols="10" rows="4">ccccccccccccccccccccccccccc</textarea>