Answers

• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  April 2023

  Sounds like you might need to create a custom renderer. See this example.

  Kevin
• allan Posts: 61,972Questions: 1Answers: 10,160 Site admin

  April 2023

  tr.child ul {
      white-space: normal;
  }
  

  should do it. https://jsfiddle.net/rj5sz6v4/ .

  Allan
• x3rt Posts: 8Questions: 2Answers: 0

  April 2023

  I tried what Allan suggested, but that unfortunately did not work. I will try to create my own test-case specific to my own situation
• x3rt Posts: 8Questions: 2Answers: 0

  April 2023

  Here is my test-case
• allan Posts: 61,972Questions: 1Answers: 10,160 Site admin

  April 2023 Answer ✓

  Thanks. The scrollX complicates things, since it lets the browser think you want the content to expand as much as it wants!

  What you need to do is set a max-width for the element and then use word-break (since it is just one big string with no white-space, the white-space option alone isn't enough):

  span.dtr-data {
    display: inline-block;
    max-width: 100px;
    word-break: break-all;
    white-space: normal;
  }
  

  https://live.datatables.net/wasagori/2/edit

  Allan
• x3rt Posts: 8Questions: 2Answers: 0

  April 2023

  Thank you so much! I feel stupid as I added scrollX when I was trying to fix it and I guess I forgot about it.
  You will see me around more as I am rewriting our website from PHP to ASP.NET so I'll also have to renew my Editor License!