Перенос слов в DataTables

Question

У меня есть содержимое этой ячейки:

<td style="max-width:200px;" class="sorting_1">
<i class="fa fa-circle text-success"></i>
<span style="width: 200px;">
    Публикация: "The Myth of Ponce de León and the Fountain of Youth"                                    
</span>

<div class="mt-1">
    <span class="text-small text-muted">
        ID: 23843933046690590                                        
    </span>
</div>
</td>

Но span не получает ширину 200px и расширяется до 400+ px - http://joxi.ru/823BXGpH9ZdEMm

Что я должен сделать, чтобы ограничить ширину 200px и обернуть слова в этой ячейке?

Answer 1

Вам нужно добавить display: block или display: inline-block

.maxWidth {
  width: 200px;
  display: inline-block;
}

<td style="max-width:200px;" class="sorting_1">
<i class="fa fa-circle text-success"></i>
<span class="maxWidth">
    Публикация: "The Myth of Ponce de León and the Fountain of Youth"                                    
</span>

<div class="mt-1">
    <span class="text-small text-muted">
        ID: 23843933046690590                                        
    </span>
</div>
</td>

Answer 2

Другая идея заключается в том, чтобы обрезать пробелы из строк, которые вы вводите в свои промежутки, используя JS или C#.

In JS:

myString = myString.trim();

In C#:

myString = myString.Trim();

Если это не помогает, попробуйте поместить содержимое в пределах <span></span> в одну строку, например так:

<span class="text-small text-muted">ID: 23843933046690590</span>

Поскольку span имеет содержимое как по умолчанию встроенный, пробел будет учитываться по длине содержимого.