Layout with width 0 (make it collapse

by techsin

HTML

<div class="row">
     <div class="col">abc</div>
     <div class="col x">test blah blah blah blah blah zzzzz.</div>
     <div class="col">def</div>
</div>

CSS

.row {
    width: 100%;
    display: table;
}

.col {
  position: relative;
  min-height: 1px;
  border: 1px #000 solid;
  display: table-cell;
}

.x {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width:100%;
    max-width: 0;
}