RE: [[css-shapes]] feedback

Thanks for your answer, but I'm still having a hard time visualizing what the actual code would look like to flow text into an SVG <rect> that already, let us say, has a pattern and a filter. If I understand it correctly, one would have to declare the <rect> redundantly, once as a rect, and once as a  CSS rectangle([<length>|<percentage>][, [<length>|<percentage>]] that seems to have no x or y attributes. How would one bind the rectangle to the <rect>, if, say, the <rect> were animated on its x and its width attributes? A <use>? How or why does the alpha channel enter the picture? It all seems rather complex, without an example of what the code for this sort of simplest of use cases (the SVG textArea) would look like.


-----Original Message-----
From: Tab Atkins Jr. [] 
Sent: Monday, September 09, 2013 8:36 PM
To: David Dailey
Cc: www-style list
Subject: Re: [[css-shapes]] feedback

On Mon, Sep 9, 2013 at 5:32 PM, David Dailey <> wrote:
> Hi,
> What I meant by the regular <rect> syntax was
> <rect x=[real number or percentage of screen] y=[ real number or percentage of screen] width=[length or percentage of screen] height=[length or percentage of screen] ... attribute-value list > -- I am assuming the spec talks about real numbers rather than imaginaries or quaternions or something else weird.

Embedding an XML micro-syntax in the middle of a CSS property seems like a rather bad idea, personally.

> And yes, sure, why not just allow people to reference a real SVG object complete with fill and stroke and all the rest instead of inventing a thing called rectangle? In the case of inner flow, having text inherit the background of a drawn svg object complete with gradient and filters makes sense to me.

You can reference an SVG image by doing "shape-outside: url(foo.svg);"
- it'll use the SVG's alpha channel to determine the shape used.

For the rest, inheriting from a non-parent SVG somewhere else in the document (or in another document) isn't happening, but gradients and filters (including using SVG filters) are already possible in specs, and at least partially possible in actual implementations.


Received on Tuesday, 10 September 2013 12:43:09 UTC