Edit in JSFiddle

<ul>
  <li class="A">BoxA</li>
  <li class="B">BoxBBoxBBoxBBoxB</li>
  <li class="C">BoxCBoxC</li>
</ul>

ul {
  display: flex;
  list-style-type: none;
  width: 100%;
}
ul li {
  flex: 0 0 auto; 
}
ul li.A {
  background: red;
}
ul li.B {
  background: blue;
}
ul li.C {
  background: green;
}