Form Group

A common form component for group related elements

Properties#

NameDescription
.form-group The form component container
.form-group-fieldset The group component for its items within
.form-group-legend The fieldset caption
.form-group-label The from group text label for form item
.form-group-item The form group element component


Features#

default#

Please login:

Forgot Password?


<form class="form-group w-64">
  <fieldset class="form-group-fieldset">
    <legend class="form-group-legend font-bold text-xl">Please login:</legend>
    <label class="form-group-label" for="password">Password:</label>
    <input class="form-group-item input border-b border-solid border-gray-500" type="text" id="paddword" name="password">
    <label class="form-group-label" for="email">Email:</label>
    <input class="form-group-item input border-b border-solid border-gray-500" type="email" id="email" name="email">
    <br>
    <br>
    <div class="flex items-center justify-between">
      <input class="button" type="submit" value="Submit">
      <a href="#" class="link underline">Forgot Password?</a>
    </div>
  </fieldset>
</form>