Application Inputs Floating label

<label for="Email" class="relative">
      <input
        type="email"
        id="Email"
        placeholder=""
        class="peer mt-0.5 w-full rounded border-gray-300 shadow-sm sm:text-sm"
      />

      <span
        class="absolute inset-y-0 start-3 -translate-y-5 bg-white px-0.5 text-sm font-medium text-gray-700 transition-transform peer-placeholder-shown:translate-y-0 peer-focus:-translate-y-5"
      >
        Email
      </span>
    </label>