Safari align-content: center bug with nested grid container #58
Description
When a grid container is nested inside another grid container, and the inner grid container occupies the same grid cells as a sibling element with greater computed height, the inner grid container fails to align-content: center.
In my original observation and my minimal repro case, it drops the content into what should be the padding-bottom. I see this in both iOS 13.3 and desktop Safari Version 13.0.4 (14608.4.9.1.4). If the inner grid container's text wraps to a second line, the alignment bug goes away because the sibling element no longer has greater computed height.
Workaround: If you're using display: grid just to get the vertical alignment, use display: flex instead. In the below screenshot, the html for fig A and fig B is identical apart from the labels and the inner grid container's display property. Fig. A's is flex and Fig B's is grid.
