Adobe

decor

Web Platform Team Blog

Making the web awesome

Shape-padding is on its way for CSS Exclusions

Note: CSS Shapes syntax has changed. For the latest information, see CSS Shapes Module Level 1.

Hans Muller has been working hard on the implementation of the shape-inside feature in CSS Exclusions and Shapes, most recently focusing on adding shape-padding functionality for rounded rectangle shapes (ellipses, circles, rectangles). Shape-padding provides a user the ability to specify how much space exists between their content and the shape-inside.

padded-circle-illustration
For more detail on how shape-padding boundaries are computed, check out Hans’s Padding the Rounded Rectangle blog post. The interactive demo at the bottom of the post is a great way to visualize how the shape-padding algorithm computes the bounds for both padding and margins.

Comments are closed.