shape-margin | CSS CSS Properties

Sets a margin for a shape created with 'shape-outside'. It adds a buffer of empty space between the custom shape and the text wrapping around it.

Quick example

.circle-wrap {
  float: left;
  shape-outside: circle(50%);
  /* Pushes the text 20px away from the curve of the circle */
  shape-margin: 20px;
}

Initial value

0

Inherited

Applies to

floats

Animation type

lpc

Widely available Since 2020 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.

Safe to use without fallbacks.

37+

62+

10.1+

79+