Styling inputs depending on state
There are a number of CSS pseudo-classes that are also exposed as TailwindCSS variants to allow styling input fields depending on their state:
These variants are supported only by the Tailwind JIT compiler.
They will not work in a bundle produced by
npm run build-dev.
<select id="amount" name="amount" class="form-select invalid:ring-2 invalid:ring-red-500" form="my_form" required > <option value=""> <?= $escaper->escapeHtml(__('Choose an Amount...')) ?> </option> </select>