текста переполнение в одном столбце в начальной загрузке стола

Question

Моей проблема заключается в том, что при добавлении текста переполнения в одной колонке, я теряю все форматирование других столбцов

<table id="table" data-show-header="false" > 
<thead> 
    <tr> 
    <th data-field="state" data-checkbox="true" data-formatter="check"></th> 
      <th data-field="fav" data-formatter="formatoFav" ></th> 
      <th data-field="nombre" class="col-md-2"></th> 
      <th data-field="asunto" class="col-md-10 abbreviation"></th> 
      <th data-field="hora" data-formatter="formatoHora" data-align="right"></th> 
    </tr> 
</thead> 

Это результат без CSS

И это с помощью CSS

.table { 
    table-layout:fixed; 
} 

.table td.abbreviation{ 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    } 

Answer 1

Переполнение требует фиксированной ширины (или высоту, если это необходимо), чтобы работать должным образом, как омнате.В можно увидеть в документации переполнения. Если вы не установите ширину и высоту в div, который хотите переполнить, он будет разбит как скрытый, когда переполняет родительский элемент (это вызывает вашу проблему).

Редакцией: лучший пример по размещать

Смотрите пример ниже:

div.foo{background:#000; width:250px;} 
 
div.foc{width:200px; border:1px solid white;} 
 
div.fo1{overflow:hidden; background:#A44;} 
 
div.fo2{width:100px; height:100px; overflow:hidden; color:#FFF;}

<div class="foo"> 
 
    <div class="foc"> 
 
<div class="fo1"> 
 
    <span>lalalalaauoshdoajhsdaodshdaojshdaosdhaosldhaoshdasdhaslkdnalsjdnljdalfblaskdfblsakdfbalkfbakldsbfkladsfblkadfbkladfbakldfbakldsbfaksbfkasfbalkdfbksdbfksadjbfkjadsbfkldfblaksdbfkladsbfkladsfbakdsfbdskjbfkbadskfbasldkfbjsadklfbakjdsbfjksad</span> 
 
</div> 
 
<div class="fo2"> 
 
    <span> auoshdoajhsdaodshdaojshdaosdhaosldhaoshdasdhaslkdnalsjdnljdalfblaskdfblsakdfbalkfbakldsbfkladsfblkadfbkladfbakldfbakldsbfaksbfkasfbalkdfbksdbfksadjbfkjadsbfkldfblaksdbfkladsbfkladsfbakdsfbdskjbfkbadskfbasldkfbjsadklfbakjdsbfjksad 
 
    </span> 
 
    
 
</div> 
 
</div> 
 
    </div>

Попробуйте удалить ширина: 200px из div.foc и посмотреть, что Happer.

Надеюсь, это поможет, Приветствия! =)