How to resize div with CSS by the border

Question

How would I let a user resize a div? I would like them to be able to grab the side of it and pull it, I DO NOT want CSS Resize property. The Resize property makes the part you drag to make it bigger in the corner. So how would I let a user make a div bigger by grabbing the side?

Answer 1

If you don’t want to use the resize property, there’s no other option to do this with CSS. However, you can achieve this with JavaScript.

There are libraries that support this, e.g. jQuery UI: http://jqueryui.com/resizable/

Of course, it’s also possible to do this in plain JavaScript. However, it’s tricky due to differences in the browser’s implementations. How to make HTML element resizable using pure javascript? might be a good starting point.