Workaround for the image size bug in IE

[ysds]

Fixes #22448
Fixes #28839

See philipwalton/flexbugs#75

In IE 11, though, it appears to size the image correctly, but the surrounding body div sizes up its height (never collapses) as if the full height of the source image were there.

Adding min-height: 1px to the flex item does, in fact, work around the issue. There's some sort of sorcery going on here in IE's guts. My best guess is that the min-height forces IE to recalculate the height of the rendered content after all of the resizing, and that makes it realize that the height is different.

Demo: https://codepen.io/fellows3/pen/QRJmmx
Left: Chrome / Right: IE11

The min-height: 1px fixes that, but my concern is this affects unexpected parts (or not). At least there is no problem with accordions.

[prosalesgmbh]

The min-height: 1px fixes that, but my concern is this affects unexpected parts (or not)

I just had to remove that line as it breaks our logic: we have 4 cards next to each other with 1 card header, 2 card bodies and 1 card footer. The second body contains the same content in all 4 cards (checks and crosses as they reflect packages with different availabilities). The upper body contains an individual explanation so the content length is different. To have all cards the same height I set up class="card h-100" and for the first body class="card-body h-100". This gets totally messed up when the min-height is provided and it seems there is no way to override that rule and set it to unset, initial, 0px whatever. Once it is present it messes up things.