CSS3 User Interface: Resize Height & Width

The following example lets the user resize both the height and the width of a <div> element:

HTML file: Displayed by browser:
<style>
div {
    border: 2px solid;
    padding: 20px;
    width: 300px;
    resize: both;
    overflow: auto;
}
</style>
<body>
<div>Let the user resize both the height and the width of this div element.</div>
</body>
Let the user resize both the height and the width of this div element.

Resize works in Chrome, Firefox, Safari and Opera. Internet Explorer does not support the resize property because they have deprecated this property.

Back button Table of Contents Next button