Crop images on gallery stopped working in 2.2

[Axinet]

Issue Overview

Crop images on gallery stopped working in 2.2.2 (horizontal images are lower than vertical ones).

Steps to Reproduce (for bugs)

1. Insert gallery block
2. Use one horizontal and one vertical image
3. Show result on frontend.

Expected Behavior

Images should be cropped like were in Gutenberg 2.1

Current Behavior

Images are not cropped.

Related Issues and/or PRs

Related to gallery captions css changes #1443 .
Problem is with styles for .wp-block-gallery .blocks-gallery-item figure which has now display: flex. Reverting to dispaly: block fixes the problem with cropping (but probably destroys captions placement).

[karmatosed]

I am unable to replicate this, which could mean it's now fixed. It also could mean I am missing a step or it's something related to your setup. In this case, let's close the issue but if you are still able to replicate we absolutely can reopen.

[ptica]

I still got bitten by this one at 5.0.2,
out of the box looks like:

Figure display changed to block fixes it for me:

It manifests itself only when the 'Link to' option is set to 'Media file' though!

[dimanotdemo]

@karmatosed I am still seeing this issue as of 5.0.3 and 5.1-beta2-44700. This issue is present when the image is linked ("Media File" or "Attachment Page"). Would recommend reopening this.

[StaggerLeee]

I experience the same. Linking to None makes it work OK.

[centuryseven]

This CSS fixed the issue for me:

.wp-block-gallery .blocks-gallery-image figure, .wp-block-gallery .blocks-gallery-item figure {
margin: 0;
height: 100%;
display: flex;
align-items: flex-end;
justify-content: flex-start;
}

.wp-block-gallery.is-cropped .blocks-gallery-image a, .wp-block-gallery.is-cropped .blocks-gallery-image img, .wp-block-gallery.is-cropped .blocks-gallery-item a, .wp-block-gallery.is-cropped .blocks-gallery-item img {
width: 100%;
flex: 1;
-o-object-fit: cover;
object-fit: cover;
height: 100%;
}