JSFiddle - React, Tailwind, and code Playground

HTML

<form action="">

  <div class="box">
    <input type="email" name="email" id="email" placeholder="example@email.com" autocomplete="off" required>
    <label for="email"> This is working </label>
  </div>

  <div class="box">
    <label for="subject"> This is not working </label>
    <input type="text" name="subject" id="subject" placeholder="Subject" autocomplete="off" required>
  </div>
</form>

CSS

form .box {
  padding: 20px 0;
}

form .box label {
  color: black;
  padding: 0px 10px;
}

form .box input:focus~label {
  color: red;
}