Re: Should the base svg element support CSS or trigger events?

On 09/02/2010 05:13 PM, Kevin Ar18 wrote:
>
>       CSS Styling
>
> Question: Can CSS styles apply to the base svg element (inserted in html)?
>
> Clarification: Resolving this issue raises all kinds of tricky problems
> for Events and other aspects.
 > ...
>     Several Options:
>
> The current plan is to clarify these issues in the SVG spec (and/or
> other specs). There are several possible solutions (and there are
> probably others that others might think of).
>
>    1. Strictly enforce current SVG specs: Declare that the svg element
>       (when inserted into html) has the following properties: (1) it
>       cannot block content underneath (2) it cannot be the target of
>       pointer events (3) it cannot be styled using CSS.
>       Pros:
>           * This seems to be the current interpretation of the SVG specs
>             and how SVG should integrate with HTML
>           * It requires the least # of changes to the specs (it may only
>             require a clarifying note).

This option would actually be inconsistent with the CSS specs, which
consider an <svg> element to be a (styleable) replaced element.

>    2. Strictly enforce the current SVG specs just like #1, with one
>       difference: Add many of the CSS styles to the SVG spec. These
>       include adding styles like border, margin, padding,
>       background-color, background-image, into the SVG spec for all SVG
>       elements.
>       This option has been suggested by Doug Schepers on his blog
>       <http://schepers.cc/css-in-svg>. Pros:
>           * It would keep all issues totally within the SVG spec.
>           * It treats all SVG the same. In the word of Doug on his blog:
>             "I don’t think this should be any different in standalone
>             SVG files than in SVG files referenced or inlined in HTML.
>             That would be very unintuitive, in my opinion."
>       Cons:
>           * Not all CSS properties are a good fit in SVG.
>           * It may be overkill to try and add the styles for all of SVG,
>             when the real problem is only the topmost svg element in a
>             CSS styled XML or HTML document.

This, IMHO, does not make much sense. If SVG wants to define the application
of these properties to an <svg> element for use on standalone SVG documents,
that's one thing. But doing that as a way of trying to integrate with CSS
seems awkward and unnecessary.

>    3. Address the SVG-in-HTML or SVG-in-XML+CSS as a special situation
>       where the "outside" of the SVG element follows the CSS box model
>       and the content area of the box follows the SVG spec -- kind of
>       like surrounding the svg element with an anonymous CSS box.
>       I outlined some of the details on this option here:
>       http://lists.w3.org/Archives/Public/public-fx//2010JulSep/0066.html
>       As of right now, this "suggestion" is a little incomplete. I would
>       really like to do some research on CSS styles first and maybe post
>       about this "suggestion" at a later time.

This is what's already in the CSS specs.

Let me emphasize that from a CSS perspective, the application of CSS
properties to the SVG element is already defined. What may or may not
be clear, but probably can be inferred from the specs, is that, in an
embedded SVG element, those same properties can also affect the internal
contents of the SVG in ways that they wouldn't with an external SVG source.
For example, the 'color' property can inherit from the surrounding HTML
into the <svg> element.

What needs to be defined is what happens when a property is set on an
embedded <svg> element that is both
   a) applicable to replaced elements in CSS
   b) applicable to the root <svg> element in SVG
If there are any properties that match both a) and b), then we need some
integration work in the specs. If there are no such properties, then no
further work is needed, except perhaps some examples in the specs to help
people understand the differences and similarities between external and
embedded SVG.

~fantasai

Received on Friday, 3 September 2010 18:26:12 UTC