Una form di input è l'insieme di più campi il cui unico scopo è raccogliere dati dall'utente. Spesso, per migliorarne l'usabilità e l'estetica, è utile che gli input si ridimensionino automaticamente in base al contenuto inserito.

In una form con la presenza di un campo in cui è richiesta una descrizione o un commento, è impossibile calcolare la lunghezza del testo che l'utente potrebbe inserire. Se il testo risulterà troppo lungo, di sicuro ci troveremo con una barra di scorrimento verticale che va solo a peggiorare l'esperienza. Un'altra casistica, a cui siamo ormai abituati, è la select con una option il cui contenuto è più lungo rispetto alla larghezza del campo stesso.

Con il CSS possiamo però ovviare a questo problema con una sola proprità: field-sizing.

textarea, select, input {
  field-sizing: content;
}

In questo modo il campo di input si ridimensionerà automaticamente in base al contenuto inserito dall'utente, eliminando la necessità di barre di scorrimento e migliorando l'esperienza complessiva della form.