How to disable resize from textarea?

Question

How do I disable resize of a textarea ?

<textarea></textarea>

I wish I couldn’t change the size of the box...

Answer 1

You can use the attribute resize to define this.

To disable changing the size of textarea you set this value to none:

<textarea style="resize: none"></textarea>

There’s still a way to limit the resize in only one direction (or vertical, or horizontal).

Examples:

Vertical only:

<textarea style="resize: vertical"></textarea>

Only: Horizontal:

<textarea style="resize: horizontal"></textarea>

Answer 2

textarea {
  resize: none;
}

<textarea></textarea>

Answer 3

Setting ownership resize for none.

Ex.: (All TextArea)

textarea {
  resize: none;
}

<textarea></textarea>

Ex.: Defining by class

.resize-none {
  resize: none;
}

<textarea class="resize-none"></textarea>

Answer 4

The estate resize controls how an element can be resized by the user by clicking and dragging the bottom right corner of the element.

$('button').on('click', function() {
  $('p').css('resize', $(this).text());
});

body {
  background-color: #1D1F1F;
}

section { 
  width: 50%;
  margin: 0 auto;
}

p {
  width: 100%;
  height: 5em;
  background-color: white;
  padding: .5em;
  overflow: scroll;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section>
  <button>both</button>
  <button>horizontal</button>
  <button>vertical</button>
  <button>none</button>
<p class="resize">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vel neque nec magna lacinia commodo in vel ante. Aliquam tincidunt, purus sit amet congue placerat, lacus mauris rhoncus nisl, nec ornare libero purus eget augue. In sed dui placerat nisl cursus aliquet. Integer nisl lorem, maximus et viverra non, aliquet vel arcu. Cras ullamcorper, arcu id molestie scelerisque, est turpis interdum mauris, sit amet pretium mi lectus at metus. Phasellus ornare odio in ipsum faucibus, et tempus est porttitor. Nullam sollicitudin eleifend mi at semper. Vivamus vel neque nec magna lacinia commodo in vel ante. Aliquam tincidunt, purus sit amet congue placerat, lacus mauris rhoncus nisl, nec ornare libero purus eget augue.</p>
</section>

See more details here in this article.