Re: Problems with SVG's CSS properties

Thanks for the careful analysis and good points.

At 04:01 AM 4/22/99 +0100, Ian Hickson wrote:
>There are a few problems with SVG and its use of CSS properties.
>This property is now defined in both SVG and CSS2. In CSS2 it is used
>for changing the case of text, in SVG it is a text analogue of the
>'transform' property. The SVG working group may wish to consider
>renaming the SVG 'text-transform' property, since the CSS property may
>be of use in SVG as well.

Ooops. Yes, we'll need to rename the property to something other than

>'font' shorthand property
>Because SVG uses different conventions for <length>, in particular
>because it allows unit-less numbers, the CSS2 'font' shorthand
>property will be unparsable in SVG. For example, how should the
>following be handled?
>   #heavy { font: 900 large sans-serif; }
>According to the CSS specification, the '900' keyword will be parsed
>as the 'font-weight' value, the 'large' keyword will be parsed as the
>'font-size' value, the 'sans-serif' keyword will be parsed as the
>'font-family' value, and all other font properties will be set to
>their initial values.
>However, in SVG '900' is a valid font-size, and so the above rule is
>ambiguous: as well as the interpretation above, another, equally valid
>interpretation is that '900' is the 'font-size' (900 user units), and
>'large sans-serif' is the 'font-family'.
>Two possible solutions are to either not use the 'font' shorthand
>property in SVG, or to give user units a unit specifier such as 'uu'.

Good point. My vote would be to define another unit specifier 'uu' as you
suggest, with its use being optional in most places in SVG (e.g.,
coordinate values in a <path>), and require that units be specified if you
want 'font: <number>' to be such that <number> represents a font size. I
think we'll need to coordinate with the CSS working group on this one.

But I'm not the world's expert in CSS. I'd like to hear some other opinions
on the subject.

>There appears to be overlap between the SVG 'text-direction' property
>and the CSS2 'direction' property. The SVG working group may wish to
>use the name 'direction' instead of 'text-direction', and then extend
>the allowed values in SVG.

I agree. We would need to coordinate with the CSS team, however, to see
whether it's OK with them for us to add parameters to one of their properties.

>text formatting
>The current spec states that:
># The standard set of text and font properties from CSS2 apply,
># including 'text-align' and 'vertical-align'.
>How is 'vertical-align' to be applied? In CSS, 'vertical-align' has a
>pivotal role in the inline level formatting model. Will SVG use the
>entire CSS inline level formatting model? This seems like serious
>overkill since SVG uses a much more direct approach to layout (namely,
>giving x and y coordinates).

What I had in mind was that 'vertical-align' indicated how to align an SVG
<text> element relative to the start point for the text string. For
example, 'top' means the top of the first character would be at the start
point for the text string, whereas 'bottom' means the bottom of the first
character would be at the start point for the text string. 

SVG would *not* do block text and word wrapping. Instead, leave that to
engines that do real text layout, such as HTML+CSS or XML+CSS.

>Exactly which font text and font properties will SVG borrow from CSS2? 

My initial reaction is that, as a simply understood rule, SVG should
support all CSS2 properties that begin with 'text' or 'font', but this
opinion is before doing in-depth study. It is clear that some of the CSS
text and font properties are a lot less important to SVG than to HTML, for
example, so maybe this simple rule isn't such a good idea. What do you think?

SVG implementors would probably prefer *not* supporting all of these

>For example, will any of the following be used?
>   text-decoration 

It isn't that often that you want to underline SVG text, is it?

>   text-shadow

Lots of overlap with SVG's filter effects.

>   text-indent

Given that text is absolutely positioned on a line-by-line basis in SVG,
this property isn't nearly as useful in SVG as in HTML.

>   font-size-adjust

This one seems to have the same value to SVG as it would have to HTML.

>Note that if 'text-decoration' is used, then it will have to be
>defined much more precisely than in CSS if results are to be reliably
>reproduced across implementations.

I agree.

>Ian Hickson 
>U+2642 U+2651
>U+262E U+2603 U+263A

Jon Ferraiolo
Adobe Systems Incorporated

Received on Monday, 26 April 1999 16:25:24 UTC