# Partes del campo

Lo que envuelve a un control: la etiqueta, la pista, el error y el grupo.

### Etiqueta, pista y error
El texto que da nombre a un control, dice lo que necesita e indica qué ha fallado.

```html
<div class="luz-field">
  <label class="luz-field__label luz-field__label--required" for="slug">Slug</label>
  <input class="luz-input luz-input--error" id="slug" type="text" required aria-invalid="true" aria-describedby="slug-hint slug-error">
  <div class="luz-field__helper" id="slug-hint">Letters, numbers and dashes.</div>
  <div class="luz-field__error" id="slug-error"><span class="u-sr-only">Error: </span>Use letters, numbers and dashes only.</div>
</div>
```

### Grupo de campos
Un grupo con borde de controles relacionados, con el nombre de su leyenda.

```html
<fieldset class="luz-fieldset">
  <legend>Shipping address</legend>
  <div class="luz-field">
    <label class="luz-field__label" for="street">Street</label>
    <input class="luz-input" id="street" type="text">
  </div>
  <div class="luz-field">
    <label class="luz-field__label" for="city">City</label>
    <input class="luz-input" id="city" type="text">
  </div>
</fieldset>
```

### Problemas conocidos
Ninguno conocido.
