MacOS Chrome textarea draggable issue

So as you can see from my title, I’m on MacOS using Chrome, and it renders <textarea>s as draggable from bottom-right corner.

Upon viewing it being dragged with firebug, it doesn’t change the “rows” or “cols” property, and it doesn’t change the “width” or “height” properties, either (at least inline).

My issue is, I seem to be able to drag it beyond the width of its containing elements, with nothing to stop it.

Has anyone dealt with this before?


I applied a max-width 100% to it, and it seems to work BETTER. But it’s still flowing past the width of the <form> element, and into the padding-right of the enclosing <article>.

Screenshot attached.

I’ve never really understood the point of this Chrome/Safari/Webkit feature. Perhaps you need to set the width to a bit less that 100%. textarea padding can blow out the width a bit. Also sizing in ems can be a pain - hence the temptation to size the textarea in px.