25.6 C
New York

AutoGrow Textareas with CSS

Published:

As the demands of the web change and developers experiment with different user experiences, the need for more native language improvements expands. Our presentation layer, CSS, has done incredibly well in improving capabilities, even if sometimes too slow. The need for native support for automatically expanding textarea elements has been long known…and it’s finally here!

To allow textarea elements to grow vertically and horizontally, add the field-sizing property with a value of content:

textarea {
  field-sizing: content; // default is `fixed`
}

The default value for field-sizing is fixed, signaling current behavior. The new behavior, content, will expand as much as possible. To constrain the size a textarea can grow, use traditional width/max-width and height/max-height properties.

Request Metrics real user monitoring
Request Metrics real user monitoring
Request Metrics real user monitoring
  • 9 More Mind-Blowing WebGL Demos
  • 39 Shirts – Leaving Mozilla

    39 Shirts – Leaving Mozilla

    In 2001 I had just graduated from a small town high school and headed off to a small town college. I found myself in the quaint computer lab where the substandard computers featured two browsers: Internet Explorer and Mozilla. It was this lab where I fell…

  • Vertically Centering with Flexbox

    Vertically Centering with Flexbox

    Vertically centering sibling child contents is a task we’ve long needed on the web but has always seemed way more difficult than it should be.  We initially used tables to accomplish the task, then moved on to CSS and JavaScript tricks because table layout was horribly…

  • Create a Simple Dojo Accordion

    Create a Simple Dojo Accordion

    Let’s be honest:  even though we all giggle about how cheap of a thrill JavaScript accordions have become on the web, they remain an effective, useful widget.  Lots of content, small amount of space.  Dojo’s Dijit library provides an incredibly simply method by which you can…


Source link

Related articles

Recent articles