How to disable textarea resizing?

HtmlCss

Html Problem Overview


I need to disable textarea horizontal resize. Sometimes I want to allow vertical resize on the textarea.

Whenever I create a contact us page the textarea is making my design ugly.

could any one give me a solution to disable it please?

Html Solutions


Solution 1 - Html

You can use css

disable all

textarea { resize: none; }

only vertical resize

textarea { resize: vertical; }

only horizontal resize

textarea { resize: horizontal; } 

disable vertical and horizontal with limit

textarea { resize: horizontal; max-width: 400px; min-width: 200px; }

disable horizontal and vertical with limit

textarea { resize: vertical; max-height: 300px; min-height: 200px; }

I think min-height should be useful for you

Solution 2 - Html

With some css like this

textarea
{
   resize: none;
}

Or if you want only vertical

textarea { resize:vertical; }

Or horizontal

textarea { resize:horizontal; } 

or both ( not your case)

textarea { resize:both; } 

Solution 3 - Html

You can put this in the CSS file:

textarea {
  resize: none;
} 

Solution 4 - Html

disable horizontal and vertical with limit

textarea { 
    width:100%;
    resize:vertical; 
    max-height:250px; 
    min-height:100px; 
}

Solution 5 - Html

For textarea I used width: 500px !important and height: 350px !important, so this CSS codes prevent user resize, but if you have other tags you must use resize: none, for complete explanations read This Link.

For example, for a p tag you must set overflow property with a value that is not visible and then set resize, none, both, vertical, horizontal.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionMo.View Question on Stackoverflow
Solution 1 - HtmlMo.View Answer on Stackoverflow
Solution 2 - HtmlMarcView Answer on Stackoverflow
Solution 3 - HtmlStelian MateiView Answer on Stackoverflow
Solution 4 - HtmlApsaraArunaView Answer on Stackoverflow
Solution 5 - HtmlAmerllicAView Answer on Stackoverflow