This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 16374 - Allow transform function list with out explicit separation
Summary: Allow transform function list with out explicit separation
Status: RESOLVED FIXED
Alias: None
Product: CSS
Classification: Unclassified
Component: Transforms (show other bugs)
Version: unspecified
Hardware: PC All
: P2 normal
Target Milestone: ---
Assignee: Dirk Schulze
QA Contact: public-css-bugzilla
URL:
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2012-03-14 17:30 UTC by Dirk Schulze
Modified: 2012-03-17 01:17 UTC (History)
6 users (show)

See Also:


Attachments
CSS Transform test (458 bytes, text/html)
2012-03-14 17:32 UTC, Dirk Schulze
Details
SVG Transform test (177 bytes, image/svg+xml)
2012-03-14 17:34 UTC, Dirk Schulze
Details
Suggestion (2.89 KB, patch)
2012-03-14 18:32 UTC, Dirk Schulze
Details

Description Dirk Schulze 2012-03-14 17:30:39 UTC
The CSS3 Transform specification might allow transform lists, where the single transform functions are not separated at all:

transform: translate(100px,100px)rotate(45deg);

The same for the presentation attribute:

transform="translate(100,100)rotate(45)"

Neither CSS3 Transforms nor SVG Transform allow it at the moment. Nevertheless, it works on the browsers: Safari, Chrome, Firefox and Opera. Currently untested is IE, I'll test it on IE today and give feedback.
Comment 1 Dirk Schulze 2012-03-14 17:32:44 UTC
Created attachment 1097 [details]
CSS Transform test
Comment 2 Dirk Schulze 2012-03-14 17:34:43 UTC
Created attachment 1098 [details]
SVG Transform test
Comment 3 Dirk Schulze 2012-03-14 17:37:43 UTC
I tested IE 10 preview, and IE 10 supports it as well.
Comment 4 Simon Fraser 2012-03-14 17:40:17 UTC
Is there precendent in any other css property that takes a bare list of functions?
Comment 5 Dirk Schulze 2012-03-14 17:43:59 UTC
(In reply to comment #4)
> Is there precendent in any other css property that takes a bare list of
> functions?

I just know of CSS Filters that have a list of functions. I'll check what WebKit does there.
Comment 6 Dean Jackson 2012-03-14 17:46:03 UTC
It's cool that everyone supports this, but I fear that adding so much
flexibility now removes any flexibility for us in the future. Imagine that we
need to add some characters after the parentheses for some reason (4d
transforms!!) or remove parentheses - we won't be able to do it if we explicitly allow this.

On the other hand, codifying existing behaviour is generally a good thing.
Comment 7 Dirk Schulze 2012-03-14 17:52:43 UTC
(In reply to comment #4)
> Is there precendent in any other css property that takes a bare list of
> functions?
Just checked -webkit-filter: drop-shadow(10px 10px 10px blue)sepia(); and it works as well.

(In reply to comment #6)
> It's cool that everyone supports this, but I fear that adding so much
> flexibility now removes any flexibility for us in the future. Imagine that we
> need to add some characters after the parentheses for some reason (4d
> transforms!!) or remove parentheses - we won't be able to do it if we
> explicitly allow this.
> 
> On the other hand, codifying existing behaviour is generally a good thing.

Wow! 4D? Don't we support it already with transitions and animations? :D

But I understand the concerns. Nevertheless, we would have to deal with it if we need the flexibility as well. Even if unspecified, we could potentially break existing content if we need the separation later.
Comment 8 Aryeh Gregor 2012-03-14 18:05:55 UTC
As I'm reading CSS 3 Values and Units, optional whitespace is always allowed between tokens in values:

"""
Component values are specified in terms of tokens, as described in Chapter 4 of [CSS21]. As the grammar allows spaces between tokens in the components of the value production, spaces may appear between tokens in property values.
"""
http://dev.w3.org/csswg/css3-values/#component-whitespace

So I suggest we just remove the sentence "The individual transform functions are separated by whitespace".  It's already covered by other specs.  I already have a test for this in 3d-transforms.html, which tests that 

  "tranSlatex( 16px )rotatez(-90deg)  rotate(100grad)\ttranslate3d(-12pt, 0, 0.0em)"

is parsed as:

  "translateX(16px) rotateZ(-90deg) rotate(100grad) translate3d(-12pt, 0px, 0em)"
Comment 9 Dirk Schulze 2012-03-14 18:32:19 UTC
Created attachment 1099 [details]
Suggestion

What about the attached diff?

Remove the sentence like Aryeh described and change SVG part like that:

If the transform list consists of more than one transform function, these functions may be separated by optional whitespace, an optional comma (‘<code class="css">,</code>’) followed by optional whitespace. The transform list can have optional whitespace characters before and after the list.
Comment 10 Aryeh Gregor 2012-03-14 18:34:44 UTC
The CSS part of that change looks good to me (I didn't review the SVG part).
Comment 11 Dirk Schulze 2012-03-15 21:44:19 UTC
Dean, do you still have concerns that we need to discuss?
Comment 12 Dirk Schulze 2012-03-17 01:17:29 UTC
Committed change today.