<form class="usa-form usa-form--large">
    <fieldset class="usa-fieldset">
        <legend class="usa-legend usa-legend--large">Name</legend>
        <p>
            Required fields are marked with an asterisk (<abbr title="required" class="usa-hint usa-hint--required">*</abbr>).
        </p>
        <label class="usa-label" for="title">Title</label>
        <input class="usa-input usa-input--sm" id="title" name="title" type="text">

        <label class="usa-label" for="first-name">
            First name <abbr title="required" class="usa-hint usa-hint--required">*</abbr>
        </label>
        <input class="usa-input usa-input--xl" id="first-name" name="first-name" type="text" required aria-required="true">

        <label class="usa-label" for="middle-name">Middle name</label>
        <input class="usa-input usa-input--xl" id="middle-name" name="middle-name" type="text">

        <label class="usa-label" for="last-name">
            Last name <abbr title="required" class="usa-hint usa-hint--required">*</abbr>
        </label>
        <input class="usa-input usa-input--xl" id="last-name" name="last-name" type="text" required aria-required="true">
    </fieldset>
</form>

No notes defined.

package:
  name: metro-digital-design-system-demo
  version: 0.1.0
uswds:
  path: ../../../dist
placeholderLink: javascript:void()