[webkit-dev] Adding CSS3 background-position offsets.

[Dirk Schulze]

On Dec 3, 2012, at 6:12 AM, "Alexis Menard" <alexis at webkit.org> wrote:

> On Mon, Dec 3, 2012 at 10:42 AM, Dirk Schulze <dschulze at adobe.com> wrote:
>> 
>> On Dec 3, 2012, at 5:31 AM, Alexis Menard <alexis at webkit.org> wrote:
>> 
>>> On Mon, Dec 3, 2012 at 10:19 AM, Dirk Schulze <dschulze at adobe.com> wrote:
>>>> 
>>>> On Dec 3, 2012, at 4:51 AM, Alexis Menard <alexis at webkit.org> wrote:
>>>> 
>>>>> Hi everyone,
>>>>> 
>>>>> I wanted to let you know that I have added the new CSS3
>>>>> background-position offsets support to WebKit.
>>>>> 
>>>>> This support is behind the ENABLE_CSS3_BACKGROUND feature define and
>>>>> it's disabled by default on all ports. I took the conservative
>>>>> approach despite it's a cool feature.
>>>>> 
>>>>> Long story short, it allows you to specify three or four values to
>>>>> background-position. It's a nice addition as you can now position the
>>>>> images using length or values in relation to any of the four corners
>>>>> of elements, not just the top left corner.
>>>>> 
>>>>> Opera, IE10 and Firefox implements this feature already (though the
>>>>> latter returns weird results using getComputedStyle).
>>>>> 
>>>>> It is tracked by https://bugs.webkit.org/show_bug.cgi?id=37514 and the
>>>>> two patches landed (parsing and rendering) are
>>>>> http://trac.webkit.org/changeset/135632 and
>>>>> http://trac.webkit.org/changeset/136378.
>>>>> 
>>>>> I believe the <position> type (3-4 values) could be/or is used in
>>>>> other cases so we can reuse the parsing code for four/three values if
>>>>> needed. I will investigate this afterwards and make appropriate
>>>>> patches.
>>>> 
>>>> I really hope that we don't use it any where else again (with the exception of -webkit-mask-position which should have same behavior as background-position). This is the use case for the calc() function. Sadly the calc() function came to late for CSS3 Backgrounds.
>>> 
>>> -webkit-mask-position should behave the same way as
>>> background-position? Even if I add feature to the latter? Why so?
>> 
>> Because -webkit-mask and background share the same properties and syntax. Why should it be different on -webkit-mask-position? (Btw. CSS Masking already adapted the background-position syntax for mask-position[1])
> 
> Ok sure. Then I will make -webkit-mask-position to behave the same per
> http://dvcs.w3.org/hg/FXTF/raw-file/tip/masking/index.html#the-mask-position
> . I did know they share the code but I didn't know how far. Thanks for
> pointing it out.
> 
>> 
>>> 
>>> it seems like transform-origin supports something similar. I need to look at it.
>>> 
>>> http://www.w3.org/TR/css3-transforms/#transform-origin-property
>> 
>> It definitely does not :)
> 
> Sorry about that I read super quickly and based my thought of one of
> the test of css3test.com which expect "right 10px bottom 20px" and
> https://bugs.webkit.org/show_bug.cgi?id=37514#c8 . I'm not sure what
> is valid or not. Maybe Simon could tell us.

Simon and I discussed it with the CSS WG and we came to the conclusion that we should not introduce the background-position syntax somewhere else in favor for calc(). -webkit-mask is so similar to background, that people have the expectations to behave the same. This is why -webkit-mask-position is an exception.

Greetings
Dirk

> 
>> 
>> Greetings,
>> Dirk
>> 
>> [1] http://dvcs.w3.org/hg/FXTF/raw-file/tip/masking/index.html#the-mask-position
>> 
>>> 
>>>> 
>>>> That said, great work regarding the interoperability with other browsers.
>>>> 
>>>> Greetings,
>>>> Dirk
>>>> 
>>>> 
>>>>> 
>>>>> I plan to enable it by default on Qt and EFL ports this week. If
>>>>> somebody wants me to enable it on their ports please tell me, I'll be
>>>>> happy to do it.
>>>>> 
>>>>> Looking forward to your comments.
>>>>> 
>>>>> Spec : http://www.w3.org/TR/css3-background/#the-background-position
>>>>> 
>>>>> --
>>>>> Software Engineer @
>>>>> Intel Open Source Technology Center
>>>>> _______________________________________________
>>>>> webkit-dev mailing list
>>>>> webkit-dev at lists.webkit.org
>>>>> http://lists.webkit.org/mailman/listinfo/webkit-dev
>>> 
>>> 
>>> 
>>> --
>>> Software Engineer @
>>> Intel Open Source Technology Center
>>> _______________________________________________
>>> webkit-dev mailing list
>>> webkit-dev at lists.webkit.org
>>> http://lists.webkit.org/mailman/listinfo/webkit-dev
> 
> 
> 
> -- 
> Software Engineer @
> Intel Open Source Technology Center