How i can restrict content of text area to height of textarea?

Question

Updated!

How i can restrict content of text area if text input by user can go beyond height of textarea? SO user is restricted.

.left {
  width: 200px;
  height: 100px;
  background-color: transparent;
  resize: none;
  outline: none;
  /* border: none; */
  overflow-y: hidden;
  padding-top: 0;
  padding-left: 0;
}

<textarea class="left"></textarea>

It's unclear what you're trying to achieve. Do you want the text area itself to be resizable until a certain height? Do you want to prevent users from typing before the text is about to overflow? Do you want to prevent the text from overflowing? — NonameSL, Aug 23 '18 at 11:00
if you will input character beyond textarea height is input should be disable — Siddharth Chauhan, Aug 23 '18 at 11:13

score 2 · Accepted Answer · answered Aug 23 '18 at 11:05

2

I wouldn't be wise to restrict the text area by size rather than setting a limit on the amount of characters that can be entered as mobile and computer screen sizes seem to vary. Try something like

<textarea rows="4" cols="50" maxlength="50">

rows="4" sets the line height of the text area to 4 lines and the 50 cols indicates the width which you can easily change by other means and the max length indicates how many characters can be entered into the text area which i believe you want to use.

answered Aug 23 '18 at 11:05

Sir Catzilla

321
3
18

if you will input character beyond textarea height is input should be disable – Siddharth Chauhan Aug 23 '18 at 11:13
Are you using any libraries? Like JQuery? – Sir Catzilla Aug 23 '18 at 11:15
Have a look at this post if you'd like to disable input after x amount of character. https://stackoverflow.com/questions/30088102/how-to-prevent-input-to-a-textarea-after-a-certain-character-count-is-reached – Remco Aug 23 '18 at 13:06

How i can restrict content of text area to height of textarea?

1 Answers1