JSFiddle - React, Tailwind, and code Playground
HTML
<div class="otrCompactView">
<div class="otrLastEditTable">
<div class="otrLastEditRow">
<div class="otrLastEditor">LastEditor</div>
<div class="otrLastEdited">LastModified</div>
</div>
</div>
<div class="otrTitleRow otrRow">
<div class="otrTitle">Title asdasdasdas asd asd asd asdas as asd </div>
</div>
<div vlass="otrTaskRow otrRow">
</div>
<div class="otrColumnsRow otrRow">
<div class="otrColumns"></div>
</div>
</div>
CSS
.otrCompactView {
display: table;
background: yellow;
width: 100%;
height: 100%;
}
.otrRow {
display: table-row;
}
.otrLastEditTable {
display: table;
width: 100%;
}
.otrLastEditRow {
display: table-row;
}
.otrLastEditor {
display: table-cell;
}
.otrLastEdited {
display: table-cell;
text-align: right;
}
.otrTitle {
border: 1px dotted red;
min-width: 50px;
white-space: nowrap;
}