Re: [css-backgrounds] [css-images] Interop for sizing gradients with only width

On Thu, Apr 13, 2017 at 5:51 AM, Philippe Wittenbergh
<ph.wittenbergh@l-c-n.com> wrote:
>
>> On Apr 13, 2017, at 7:30 PM, Henrik Andersson <henke@henke37.cjb.net> wrote:
>>
>> This following code acts differently in Chrome and SeaMonkey(Gecko).
>> Which is correct?
>>
>> Chrome gives the same result as if the background-size specified 33% for
>> the height. SeaMonkey thinks it should have a height of 100%.
>>
>> div {
>>    width: 160px;
>>    background-repeat: repeat-x;
>>    background-size: 33%;
>>    height: 400px;
>>    background-image: linear-gradient(red, red);
>>    border: black solid 1px;
>> }
>
> Per CSS3 - backgrounds:
> https://drafts.csswg.org/css-backgrounds/#the-background-size
>
> For background-size:
>
>> [ <length-percentage> | auto ]{1,2}
>> The first value gives the width of the corresponding image, the second value its height. If only one value is given the second is assumed to be ‘auto’.
>
> further, for auto, the text notes:
>
>> An ‘auto’ value for one dimension is resolved by using the image's intrinsic ratio and the size of the other dimension, or failing that, using the image's intrinsic size, or failing that, treating it as 100%.
>
> For a gradient (as in your example), the “image” has no intrinsic size, thus 100% should be used. That is what Firefox / Gecko does. Chrome and Safari are wrong.

This is correct. Chrome/Safari are buggy here.  Mind filing bugs?

~TJ

Received on Thursday, 13 April 2017 20:39:32 UTC