Interactivity

Resize

Utilities for sets whether an element is resizable, along with direction.

Variant

Responsive Dark Mode Light Mode Reduce-Motion Selection-Hover Expand First-Last-Selection Child-Selection Portrait Landscape Fullscreen Hover Group-Hover Focus Group-Focus Focus-Visible Focus-Within Active Visited Checked Disabled

API

class	css
resize	resize: both
resize-none	resize: none
resize-x	resize: horizontal
resize-y	resize: vertical

Usage

Resize both x and y directions.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur aperiam, ipsum aspernatur pariatur rerum doloremque porro quibusdam, vitae doloribus eaque corporis harum asperiores distinctio quam veniam nobis odit nisi inventore.

<div class="resize ... overflow-auto">
  ...
</div>

HTML

Resize both x only directions.

<div class="resize-x ... overflow-auto">
  ...
</div>

HTML

Resize both y only directions.

<div class="resize-y ... overflow-auto">
  ...
</div>

HTML