html – Add a scrollbar to a </h1><div class="entry-meta entry-meta-divider-dot"> <span class="posted-by"><span class="meta-label">By</span><span class="author vcard"><a class="url fn n" href="https://technoteshelp.com/author/martin/">Martin</a></span></span> <span class="posted-on"> <time class="entry-date published updated" datetime="2022-01-08T15:06:51+00:00">January 8, 2022</time> </span> </div><!-- .entry-meta --> </header><!-- .entry-header --> <div class="entry-content single-content"> <h2>html – Add a scrollbar to a <textarea></h2> <p>What you need is <code>overflow-y: scroll;</code></p> <p><a href=http://jsfiddle.net/7BmZb/ rel=noreferrer><strong>Demo</strong></a></p> </p> <div class=snippet data-babel=false data-console=true data-hide=false data-lang=js> <div class=snippet-code> <pre class=snippet-code-css lang-css prettyprint-override><code> textarea { overflow-y: scroll; height: 100px; resize: none; /* Remove this if you want the user to resize the textarea */ }</code></pre> <pre class=snippet-code-html lang-html prettyprint-override><code><textarea></textarea></code></pre> </div> </div> <p>Try adding below <code>CSS</code></p> <pre><code>textarea { overflow-y:scroll; } </code></pre> <h4>html – Add a scrollbar to a <textarea></h4> <p>You will need to give your textarea a set height and then set overflow-y</p> <pre><code>textarea { resize: none; overflow-y: scroll; height:300px; } </code></pre> </div><!-- .entry-content --> <footer class="entry-footer"> </footer><!-- .entry-footer --> </div> </article><!-- #post-5056 --> <nav class="navigation post-navigation" aria-label="Posts"> <h2 class="screen-reader-text">Post navigation</h2> <div class="nav-links"><div class="nav-previous"><a href="https://technoteshelp.com/git-replace-local-version-with-remote-version/" rel="prev"><div class="post-navigation-sub"><small><span class="kadence-svg-iconset svg-baseline"><svg aria-hidden="true" class="kadence-svg-icon kadence-arrow-left-alt-svg" fill="currentColor" version="1.1" xmlns="http://www.w3.org/2000/svg" width="29" height="28" viewBox="0 0 29 28"><title>Previous</title><path d="M28 12.5v3c0 0.281-0.219 0.5-0.5 0.5h-19.5v3.5c0 0.203-0.109 0.375-0.297 0.453s-0.391 0.047-0.547-0.078l-6-5.469c-0.094-0.094-0.156-0.219-0.156-0.359v0c0-0.141 0.063-0.281 0.156-0.375l6-5.531c0.156-0.141 0.359-0.172 0.547-0.094 0.172 0.078 0.297 0.25 0.297 0.453v3.5h19.5c0.281 0 0.5 0.219 0.5 0.5z"></path> </svg></span>Previous</small></div>git replace local version with remote version</a></div><div class="nav-next"><a href="https://technoteshelp.com/javascript-text-area-in-material-ui/" rel="next"><div class="post-navigation-sub"><small>Next<span class="kadence-svg-iconset svg-baseline"><svg aria-hidden="true" class="kadence-svg-icon kadence-arrow-right-alt-svg" fill="currentColor" version="1.1" xmlns="http://www.w3.org/2000/svg" width="27" height="28" viewBox="0 0 27 28"><title>Continue</title><path d="M27 13.953c0 0.141-0.063 0.281-0.156 0.375l-6 5.531c-0.156 0.141-0.359 0.172-0.547 0.094-0.172-0.078-0.297-0.25-0.297-0.453v-3.5h-19.5c-0.281 0-0.5-0.219-0.5-0.5v-3c0-0.281 0.219-0.5 0.5-0.5h19.5v-3.5c0-0.203 0.109-0.375 0.297-0.453s0.391-0.047 0.547 0.078l6 5.469c0.094 0.094 0.156 0.219 0.156 0.359v0z"></path> </svg></span></small></div>javascript – Text Area in material-ui</a></div></div> </nav><div id="comments" class="comments-area"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/html-add-a-scrollbar-to-a/#respond" style="display:none;">Cancel reply</a></small></h3><form action="https://technoteshelp.com/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message" aria-hidden="true">Required fields are marked <span class="required" aria-hidden="true">*</span></span></p><p class="comment-form-comment comment-form-float-label"><textarea id="comment" name="comment" placeholder="Leave a comment..." cols="45" rows="8" maxlength="65525" aria-required="true" required="required">Comment *

Name *

Email *

Website

Save my name, email, and website in this browser for the next time I comment.