bug(material/card): The mat-progress-bar overflows when placed in the mat-card-footer

[AntonGorelov]

trafficstars

Is this a regression?

• [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

16

Description

In the documentation example "Card with footer" (loading bar) the loader is out of bounds.

https://material.angular.io/components/card/examples#card-footer

Reproduction

StackBlitz link: https://stackblitz.com/edit/pm8knt-rswhv3?file=src%2Fexample%2Fcard-footer-example.html

Expected Behavior

Content should not extend beyond the borders of the card

Actual Behavior

when using elements such as picture, progress-bar the corners of the borders are different from the inserted content.

Environment

• Angular: 17.3.1
• CDK/Material: 17.3.1
• Browser(s): Chrome 123.0.6312.59 (Official Build) (arm64)
• Operating System (e.g. Windows, macOS, Ubuntu): macOS Sonoma 14.4