В адаптивной таблице text-overflow:ellipsis
не работает при увеличении данных в th
(по мере увеличения ширины col-xs-2
).
Код ниже:
<link href="#" onclick="location.href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'; return false;" rel="stylesheet">
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th class="col-xs-2" style="text-overflow: ellipsis;">Lorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem Ipsum</th>
<th class="col-xs-1">Firstname</th>
<th class="col-xs-1"> Lastname</th>
<th class="col-xs-4">Age</th>
<th class="col-xs-2">City</th>
<th class="col-xs-2">Country</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Anna</td>
<td>Pitt</td>
<td>35</td>
<td>New York</td>
<td>USA</td>
</tr>
</tbody>
</table>
</div>