JSFiddle - React, Tailwind, and code Playground

HTML

<section>

  <input type="file" id="test">
  <button><label for="test">Click me</label></button>

</section>

CSS

input[type="file"] {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
}

button{
  padding: 0;
}

section {
  padding: 30px;
  border: 1px solid lightgray;
  width: 200px;
  margin: 100px;
}

label {
  display: block;
      padding: 1px 7px 2px;
}