Proprietà resize
La proprietà resize vieta o consente
la modifica delle dimensioni di textarea
o di altri elementi (con altri elementi
non funziona in tutti i browser).
Sintassi
selettore {
resize: both | horizontal | vertical | none;
}
Valori
| Valore | Descrizione |
|---|---|
both |
Permette di ridimensionare l'elemento in larghezza e altezza. |
horizontal |
Permette di ridimensionare l'elemento solo in larghezza. |
vertical |
Permette di ridimensionare l'elemento solo in altezza. |
none |
Non è possibile modificare le dimensioni dell'elemento. |
Valore predefinito: none. Per textarea
in alcuni browser: both. Nei
browser che non supportano resize, textarea
si comporterà come se fosse impostato il valore none.
Esempio . Valore both
L'elemento si ridimensiona in entrambe le direzioni:
<textarea></textarea>
textarea {
resize: both;
width: 200px;
height: 200px;
}
:
Esempio . Valore horizontal
L'elemento si ridimensiona solo orizzontalmente:
<textarea></textarea>
textarea {
resize: horizontal;
width: 200px;
height: 200px;
}
:
Esempio . Valore vertical
L'elemento si ridimensiona solo verticalmente:
<textarea></textarea>
textarea {
resize: vertical;
width: 200px;
height: 200px;
}
:
Esempio . Valore none
L'elemento non si ridimensiona affatto:
<textarea></textarea>
textarea {
resize: none;
width: 200px;
height: 200px;
}
:
Esempio . Limitazione larghezza e altezza
È possibile limitare la larghezza e l'altezza
minima e massima utilizzando le proprietà max-width,
min-width,
max-height,
min-height:
<textarea></textarea>
textarea {
resize: both;
min-height: 100px;
max-height: 300px;
min-width: 100px;
max-width: 300px;
}
: