JSFiddle - React, Tailwind, and code Playground

by Kishore Sahasranaman

HTML

<div class="container-multiline">
    <div class="row-multiline">
        <div class="left-multiline examCellLeft exam-comment-  label">
            <label class="exam-label- color">ExamComments:</label>
        </div>
        <div class="right-multiline examCellCommentRight exam-comment-data wrap-long-word">
            <label>Loooooooooooooooooooooooooooooooooooooooooooooooongcontinuoussentence!</label>
        </div>
    </div>
</div>
</div>

CSS

.container-multiline {
    display: table;
}
.row-multiline {
    display: table-row;
}
.left-multiline, .right-multiline {
    display: table-cell;
}
.examCellRight {
    border: none;
    padding:0
}
.examCellLeft {
    border: none;
    width: 90px;
    padding:0;
}
.exam-comment-label {
    width: 88px;
    padding: 0;
    vertical-align: top;
    text-align: right;
}
.examCellCommentRight {
    border: none;
    padding-left:5px
}
.exam-comment-data {
    border: none;
    padding-left: 5px
}
.wrap-long-word {
    max-width: 490px;
    word-wrap: break-word;
}