[css3-images] rtl/ltr annotation from Kang-Hao (Kenny) Lu on 2012-03-10 (www-style@w3.org from March 2012) (original) (raw)

(12/03/11 4:16), Tab Atkins Jr. wrote:

On Sat, Mar 10, 2012 at 11:57 AM, Andrew Fedoniouk <news@terrainformatica.com> wrote:

Reference: http://dev.w3.org/csswg/css3-images/#image-notation

Am I correct in my assumptions that two cases below are functional equivalents?

  1. el { background: image(a.png ltr, b.png rtl); }

  2. el:dir(ltr) { background: url(a.png); } el:dir(rtl) { background: url(b.png); }

In other words, these ltr/rtl annotators are sensors of what actually?

They aren't sensors at all. They declare the image to be ltr or rtl. Then, if it finds itself in an element with opposite directionality, it's flipped in the inline direction. So no, your two cases are definitely not equivalent.

All of this is described pretty clearly in the spec. The entire description is a single short paragraph.

which I'll include here

Along with each ‘’, the author may specify a

directionality, similar to adding a dir attribute to an element in

HTML. The ‘image()’ function takes on the directionality of the

used ‘’, if any. If a directional image is used on or

in an element with opposite direction, the image must be flipped in

the inline direction (as if it was transformed by, e.g.,scaleX(-1),

if the inline direction is the X axis).

Regarding this, I don't think there is a use case for specifying different modes (non-flipping, ltr, rtl) for different images in the fallback chain. The fact that the syntax allows this seems to indicate that this syntax is suboptimal, although I don't have better suggestion at the moment.

By the way, this paragraph draws analogy with @dir in HTML which might be the reason of this confusion because in HTML @dir defaults to ltr (in some sense) while the default is "non-flipping" here.

Cheers, Kenny

Received on Saturday, 10 March 2012 20:35:07 UTC