Checkout my CSS Grid By Example and Getting Started With React video courses on Skillshare. Sign up now and get one free month of Skillshare.

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
Resize
by JS Craft (@js-craft)
on CodePen.

Home Screencasts Best of Newsletter Search X