Search code examples
javascripthtmlcss

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

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>

Solution

  • 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.