How to make <div> resizeable?

Question

Is there a way to make a <div> container resizeable with drag & drop?

Answer 1

The best method would be to use CSS3. It supported by at least Webkit and Gecko.

According to the w3c spec:

div.my_class {     resize:both;     overflow:auto; /* something other than visible */ } 

Webkit and Firefox do not interpret the specs the same way. In Webkit the size is limited to the width and height set. There's another question: How can I use CSS to make an element resizable to a dimension smaller than the initial one? concerning this.

Answer 2

div {   border: 1px solid black; }  .resizable-content {   min-height: 30px;   min-width: 30px;   resize: both;   overflow: auto;   max-height: fit-content;   max-width: fit-content; }

<div class="resizable-content">Resize Me!</div>