JSFiddle - React, Tailwind, and code Playground

HTML

<section class="flexbox">
  <div class="input-class">
    <input type="text" placeholder="info..." />
  </div>
  <div class="button-class">
    <button>button</button>
  </div>
</section>

SCSS

* { box-sizing: border-box; margin: 0; padding: 0; }
body { 
  margin: 1rem; 
}
h1 { 
  margin: 2rem 0 0; 
}

.flexbox { 
  display: flex;
  
  .input-class {
    flex: 1;
  }
  
  .button-class {
    flex: 0;
    margin: 0 0 0 1rem;
  }
  
  input {
    padding: .5em 1em;
    width: 100%;
  }
  
  button {
    padding: .5em 1em;
    white-space: nowrap;
  }
}