Since the release of Chrome v78.0.3904.70, I am seeing issues with using with the CSS property white-space: nowrap;. The non-breaking space seems to cause a line break. When using text-overflow: ellipsis, the actual text will not display as it is broken outside of the container. Only seems to happen if the text is too long to display.
.box-inline {
max-width: 120px;
overflow: hidden;
height: 16px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
}<div class="mar-rgt box-inline text-sm"><span class="label" style="background: rgb(176, 223, 246);"></span> Not meeting expecations</div>
It's causing a few display problems on our applications. Is this a bug or is there something wrong with my code?
This code is being rendered in React 16.