Untitled

<!DOCTYPE html>
<html>
<head>
<style>
div {
  border: 2px solid;
  padding: 20px;
  width: 300px;
  resize: both;
  overflow: auto;
}
#r::-webkit-resizer {
  border: 2px solid black;
  background: red;
  width: 10px;
  height: 10px;
}
</style>
</head>
<body>

<h1>The resize Property</h1>

<div id="r">
  <p>Let the user resize both the height and the width of this div element.</p>
  <p>To resize: Click and drag the bottom right corner of this div element.</p>
</div>