Skip to content

Instantly share code, notes, and snippets.

@madeas
Last active May 22, 2018 12:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save madeas/b589de8594841c48074d8ee608f90e86 to your computer and use it in GitHub Desktop.
Save madeas/b589de8594841c48074d8ee608f90e86 to your computer and use it in GitHub Desktop.
textarea autosize on css+js
.custom-css-textarea {
width: 100%;
min-height: 150px;
box-sizing: border-box;
/* box-sizing: padding-box; */
overflow:hidden;
/* stylization */
padding:5px;
}
<textarea class="custom-css-textarea" name="css" placeholder="Свои правила CSS"></textarea>
var textarea = document.querySelector('textarea');
textarea.addEventListener('keydown', autosize);
function autosize(){
var el = this;
setTimeout(function(){
el.style.cssText = 'height:auto; padding:5px';
// for box-sizing other than "content-box" use:
// el.style.cssText = '-moz-box-sizing:content-box';
el.style.cssText = 'height:' + el.scrollHeight + 'px';
},0);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment