Quantcast
Channel: web development tutorials » Html
Viewing all articles
Browse latest Browse all 12

textarea resize disable

$
0
0

How to disable text area re size icon for chrome or webkit browsers.

Safari and Chrome that allows a textarea to be resized by the user. In both browsers the feature is seen by a little icon that is in the bottom right corner of the textarea. This feature gives the user the ability to choose how much space they need for whatever it is they are writing.How ever in some scenario we must turn off this feature as it distract other HTML elements while re sizing the text area. Below is simple hack using CSS


Recently when i was implementing new application , i was asked to remove the text area resize feature and text area glow when user focuses on the text area. Thank god it doesn’t took much effort. it can be done with simple CSS tweaks.
i placed the following CSS code in my page and it solved :)

.exampletextarea {
resize:none;
outline:none;
}

Or

textarea{
resize: none;
max-width: 100px; 
max-height: 100px;
outline:none;
}

Viewing all articles
Browse latest Browse all 12

Trending Articles