Checkout my Getting Started with React video course on Skillshare. It is 100% free.

How to make any HTML element resizable with the CSS resize property

Any element can be made resizable if we apply the folowing CSS to it:

resize: both;

Please note that it will work only if the overflow property is set to something other than visible. We can even combine the resize with something like min-width or max-with to set specific bonds for it. Also, any attributes like offsetWidth will be updated to the new sizes.

See the Pen
by JS Craft (@js-craft)
on CodePen.