JSFiddle - React, Tailwind, and code Playground

by AlexandrAbakumov

HTML

<div class="container">
  <div class="child">Child 1Child 1Child 1Child 1Child 1Child 1Child 1</div>
  <div class="child">Child 2Child 2Child 2Child 2Child 2Child 2Child 2</div>
  <div class="child">Child 3Child 3Child 3Child 3Child 3Child 3Child 3</div>
</div>

CSS

.container {
  background-color: black;
  display: flex;
  /*flex-wrap: nowrap;*/
  max-width: 100%;
}

.child {
  border: 1px solid;
  background-color: yellow;
  text-overflow: ellipsis;
  white-space: nowrap;
}