JSFiddle - React, Tailwind, and code Playground

HTML

The input should overflow off the right side of the flex container below:
<div class="flexContainer">
    <div class="spacer"></div>
    <input>
</div>

CSS

.flexContainer {
  display: flex;
  width: 150px;
  border: 2px solid red;
}

.spacer {
  /* Just to occupy some space, so that the flex algorithm will try to shrink the input below its 100% specified width */
  flex: 0 0 100px;
  background: gray;
}

input {
  width: 100%;
}