<fieldset class="usa-fieldset">
      <legend class="usa-legend">Select one historical figure</legend>
      <div class="usa-radio">
          <input class="usa-radio__input usa-radio__input--tile" id="historical-truth-2" type="radio" name="historical-figures-2" value="sojourner-truth" checked>
          <label class="usa-radio__label" for="historical-truth-2">Sojourner Truth</label>
      </div>
      <div class="usa-radio">
          <input class="usa-radio__input usa-radio__input--tile" id="historical-douglass-2" type="radio" name="historical-figures-2" value="frederick-douglass">
          <label class="usa-radio__label" for="historical-douglass-2">Frederick Douglass <span class="usa-checkbox__label-description">This is optional text that can be used to describe the label in more detail.</span></label>
      </div>
      <div class="usa-radio">
          <input class="usa-radio__input usa-radio__input--tile" id="historical-washington-2" type="radio" name="historical-figures-2" value="booker-t-washington">
          <label class="usa-radio__label" for="historical-washington-2">Booker T. Washington</label>
      </div>
      <div class="usa-radio">
          <input class="usa-radio__input usa-radio__input--tile" id="historical-marshall-2" type="radio" name="historical-figures" value="thurgood-marshall" disabled>
          <label class="usa-radio__label" for="historical-marshall-2">Thurgood Marshall</label>
      </div>
  </fieldset>

No notes defined.

package:
  name: metro-digital-design-system-demo
  version: 0.1.0
uswds:
  path: ../../../dist
placeholderLink: javascript:void()
  • Handle: @radio-buttons--tile
  • Preview:
  • Filesystem Path: src\components\radio-buttons\radio-buttons--tile.njk