尽管使用了break all和break word，但是word warp在html中不起作用

Question

I am using below code in my project for wrapping the text but the text is still overflowing to the next text box. I also tried using word-wrap:break-all but it did not work. I am using Chrome to test my code.

Can anyone suggest what should I use to wrap text in this scenario?

Code :

<td style="word-wrap:break-word" <%if((sv.ownername).getClass().getSimpleName().equals("ZonedDecimalData")) {%>align="right"<% }else {%> align="left" <%}%> ><%=smartHF.getHTMLOutputFieldSFL(sv.ownername, "ownername", 0)%></td>

Answer 1

add this one

word-break: break-all;  
white-space:normal;

Answer 2

You can use this html

<table width="100" border="1" style="table-layout:fixed">
  <tr>
    <td><div style="word-wrap:break-word"> 23232323232323232323232323232323232323232323232323</div></td>
    <td>abcabc</td>
  </tr>
</table>

Answer 3

You should give width to the text holder so that word-wrap will work

 p.test { width: 100px; border: 1px solid #000000; word-wrap: break-word; } 

 <table> <tr> <td> <p class="test"> I am using below code in my project for wrapping the text but the text is still overflowing to the next text box. I also tried using word-wrap:break-all but it did not work. I am using Chrome to test my code.</p> </td> </tr> </table> 

Answer 4

I had struggled with a similar issue for a while and finally realized that a parent container's height was limited and its overflow property was set to hidden.

After allowing the parent to be taller I finally was able to see the text.

Hope this helps