[Webkit-unassigned] [Bug 228995] New: CSS keyframed animations don't respect edges in 4 value background-position

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Wed Aug 11 04:47:00 PDT 2021


https://bugs.webkit.org/show_bug.cgi?id=228995

            Bug ID: 228995
           Summary: CSS keyframed animations don't respect edges in 4
                    value background-position
           Product: WebKit
           Version: Safari 14
          Hardware: All
                OS: macOS 11
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: hello at lcas.dev

The following example behaves as expected in Chrome and FF, but behaves incorrectly in Safari:

In Firefox and Chrome the Deno logo moves from the top right to the middle. In Safari the logo moves from the top left to the middle.


```html
<style>
  div {
    background-image: url(https://deno.land/logo.svg);
    background-size: 10px;
    background-repeat: no-repeat;
    height: 100px;
    width: 100px;

    animation: move 1s;
  }

  @keyframes move {
    from {
      background-position: right 0 top 0px;
    }

    to {
      background-position: right 50px top 10px;
    }
  }
</style>
<div></div>
```

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20210811/98ee8f53/attachment.htm>


More information about the webkit-unassigned mailing list