Свойство resize

Свойството resize забранява или разрешава промяна на размерите на textarea или други елементи (с други елементи работи не във всички браузъри).

Синтаксис

cssселектор {
  resize: 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;
}

Результат: