How to make a div resizable for users?

Question

What is the simplest way to offer a resize div method for users, such as the StackOverflow text box. Can this be done via HTML only or is JavaScript required?

Answer 1

<div style="resize:vertical;overflow:auto;"></div>

Did you mean this?

Answer 2

DEMO FIDDLE (2 and 3)

1. If you want it to look and behave exactly like the textarea in SO, then you definitely need JavaScript. More info here.

2. If you just want a simple realizable div to display text, this should be sufficient:

HTML

<div class="display-info">Resizeable div</div>

CSS

.display-info {
    resize: vertical;
    overflow:auto; 
    width: 250px; 
    height: 50px;
    border: 1px solid gray;
    background-color: lightgray;
}

3. If you want a textarea that allows users to type something in it (For eg: a form):

HTML

<textarea name="test" id="test" cols="30" rows="10">Text area</textarea>

CSS

#test {
    resize: vertical; /* can on be resized vertically*/
}