[Webkit-unassigned] [Bug 226522] Layout bug with nested grid inside flex

[bugzilla-daemon at webkit.org]

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

Viktor Chernodub <chernodubv at gmail.com> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |chernodubv at gmail.com

--- Comment #4 from Viktor Chernodub <chernodubv at gmail.com> ---
For some reason, the grid container calculates its height based on the page height. So the content is at the center of the page, rather than at the center of the parent container. Here's a more concise example:

---

<div class="flex">
  <div class="grid">Content</div>
</div>

<style>
  .flex {
    display: flex;
    flex-direction: column;
  }

  .grid {
    background: yellow;

    display: grid;
    grid-auto-flow: column;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
</style>

-- 
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/20221207/0329a96c/attachment.htm>