The resize property controls whether and how the user can interactively change the size of an element’s box using the browser’s native resizing UI. When enabled, the element typically presents a draggable handle that lets users expand or shrink the box along one or both axes; when disabled, the box remains fixed regardless of pointer interaction. This property is most obvious on controls such as multi-line text inputs and dialog-like panels, but it can be applied to any element that establishes a box, and its practical effect depends on the element’s ability to overflow and accept a change in its used width/height.

Because resizing changes an element’s used dimensions, it interacts closely with layout and constraint properties: a user-initiated size change will be subject to any minimum or maximum constraints placed on the box, and will cause normal reflow of surrounding content as the box grows or shrinks. For example, authors commonly combine it with min-width and max-width constraints to limit how small or large the user can make an element, and with overflow settings to control whether the element shows scrollbars or clips its content when its size is reduced. The visual affordance and resizing behavior are implemented by the user agent, so the exact handle appearance and the way the box interacts with margins, padding, and borders can vary.

Enabling user resizing has usability and accessibility implications: it can help users tailor input areas to their needs, but it can also break carefully designed responsive layouts or obscure adjacent content if unconstrained. To provide a good experience, authors should consider how resized elements affect surrounding flow and whether to constrain them with appropriate layout rules. If you need to respond programmatically to size changes, use DOM measurement tools (for example, a ResizeObserver) rather than relying on style-change events; and consider the element’s box model behavior by coordinating with box-sizing so your paddings and borders behave as expected when the user resizes the element. Finally, note that the presence and exact behavior of the resize affordance are determined by the browser and platform, so testing across target environments is recommended.