Уласцівасць resize

Уласцівасць resize забараняе або дазваляе змяненне памераў textarea ці іншых элементаў (з іншымі элементамі працуе не ва ўсіх браўзерах).

Сінтаксіс

cssселектар {
  resize: both | horizontal | vertical | none;
}

Значэнні

Значэнне Апісанне
both Можна расцягваць элемент па шырыні і вышыні.
horizontal Можна расцягваць элемент толькі па шырыні.
vertical Можна расцягваць элемент толькі па вышыні.
none Змяняць памеры элемента нельга.

Значэнне па змаўчанні: none. Для textarea у некаторых браўзерах: both. У тых браўзерах, дзе няма падтрымкі resize, textarea будзе весці сябе так, быццам зададзена значэнне none.

Прыклад . Значэнне both

Элемент расцягваецца ў абодва бакі:

html<textarea></textarea>
csstextarea {
  resize: both;
  width: 200px;
  height: 200px;
}

Результат:

Прыклад . Значэнне horizontal

Элемент расцягваецца толькі па гарызанталі:

html<textarea></textarea>
csstextarea {
  resize: horizontal;
  width: 200px;
  height: 200px;
}

Результат:

Прыклад . Значэнне vertical

Элемент расцягваецца толькі па вертыкалі:

html<textarea></textarea>
csstextarea {
  resize: vertical;
  width: 200px;
  height: 200px;
}

Результат:

Прыклад . Значэнне none

Элемент не расцягваецца наогул:

html<textarea></textarea>
csstextarea {
  resize: none;
  width: 200px;
  height: 200px;
}

Результат:

Прыклад . Абмежаванне шырыні і вышыні

Можна абмежаваць мінімальную і максімальную шырыню і вышыню з дапамогай уласцівасцей max-width, min-width, max-height, min-height:

html<textarea></textarea>
csstextarea {
  resize: both;
  min-height: 100px;
  max-height: 300px;
  min-width: 100px;
  max-width: 300px;
}

Результат: