JSFiddle - React, Tailwind, and code Playground

HTML

<form id="testForm">
    <input type="text" id="input1">
    <input type="text" id="input2">
</form>

CSS

#testForm{
  padding: 0;
  display: flex;
  max-width: 600px;
}
#input1{
  background: red;
  transition: all .5s ease;
}

#input2{
  background: blue;
  transition: all .5s ease;
}

#input1:focus{
  flex: 1 1 auto;
}

#input2:focus{
  flex: 1 1 auto;
}