cancel
Showing results for 
Search instead for 
Did you mean: 
budrigby
Level 5
Status: Reviewed

When inputting a comment, the text area is too small and only shows two lines. You do need to scroll to see the full comment if its longer than two lines.  We have users that paste input or paste large comments and it would be helpful to see more of the comment when doing so. 

2 Comments
Status changed to: Reviewed
Karen_Hunter
Staff
Staff
benjonson
Level 2

Hello, To make the text area display more lines and auto-resize based on content, you can use the following solution:

  1. Set a Larger Initial Size: Increase the default number of visible lines.
  2. Enable Auto-Resize: Use JavaScript to adjust the height based on the content.

Follow this code :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Resizable Text Area</title>
<style>
  textarea {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
  }
</style>
</head>
<body>

<textarea id="comment" rows="4" placeholder="Enter your comment..."></textarea>

<script>
  const textarea = document.getElementById('comment');
  textarea.addEventListener('input', () => {
    textarea.style.height = 'auto';
    textarea.style.height = textarea.scrollHeight + 'px';
  });
</script>

</body>
</html>