Show resize handle on hover

I need elements to be resizable using resize: both, and it does work, but I want to show the corner handle just when hovering the element, is there a way to do it?

That’s the handle I want to show on hover only.

>Solution :

Use resize: both; inside the :hover rule

.resize {
  outline: 1px solid black;
  overflow: auto;
  min-height: 100px;
  min-width: 100px;
}

.resize:hover {
  resize: both;
}

<div class="resize"></div>