Contact emails
[email protected]

Specification
https://drafts.csswg.org/css-shapes/#shape-outside-property


Summary
Adds support for the path() and shape() shape functions in the CSS 
shape-outside property. These functions allow developers to define float 
exclusion shapes using rectangle coordinates, aligning Chrome with Firefox and 
Safari which already support this feature.


Blink component
Blink>CSS


Web Feature ID
shape-outside


Motivation
The CSS shape-outside property currently accepts basic shape functions 
(circle(), ellipse(), inset(), polygon()) and the url() function for 
image-based shapes, but it does not support path() or the newer shape() 
function. This is an inconsistency in the CSS Shapes specification, since 
path() and shape() are already supported in other CSS properties such as 
clip-path and offset-path. Web developers who want to wrap text around complex, 
arbitrary shapes are forced to work around this limitation by using image-based 
workarounds (eg, transparent PNG images with url()), which are less ergonomic, 
harder to maintain, not responsive, and not animatable. There is no way today 
to use an SVG-style path string or a shape() command directly in shape-outside. 
Supporting path() and shape() in shape-outside brings parity with clip-path and 
offset-path, reduces the need for image-based hacks, and enables developers to 
define complex text-wrapping shapes inline in CSS. It also enables shape 
animation when combined with CSS transitions and animations, improving the 
expressiveness and capability of CSS layout.


Initial public proposal
No information provided


Goals for experimentation
None


Requires code in //chrome?
False


Tracking bug
https://issues.chromium.org/u/2/issues/502328208


Estimated milestones


Shipping on desktop 149

Shipping on Android 149

Shipping on WebView 149

Shipping on iOS 149




Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/5080980370096128?gate=5145881268584448


This intent message was generated by Chrome Platform Status.

-- 
You received this message because you are subscribed to the Google Groups 
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/69de62f9.050a0220.b4a7a.0053.GAE%40google.com.

Reply via email to