USWDS-Site - Bug: Flag Layout Cards overlapping

hobbez commented 9 months ago

Describe the bug

Browsing the Flag Layout Card demo on the USWDS website's Card Component page results in an overlap of cards and elements within the cards when the browser window has a width of 1024px to about 1380px. Checked with Firefox, Chrome and Safari on MacOS.

Steps to reproduce the bug

Go to https://designsystem.digital.gov/components/card/
Resize browser window width to 1024px~1380px
Overlap in Flag Layout Card should be evident

Expected Behavior

No overlap of cards or elements in cards. If there is to be an overlap, each card should be in its own "row".

Related code

No response

Screenshots

System setup

No response

Additional context

Slack thread: https://gsa-tts.slack.com/archives/C3F14AHSQ/p1696350438474629

Code of Conduct

[X] I agree to follow this project's Code of Conduct.
[X] I checked the current issues for duplicate bug reports.

thisisdano commented 9 months ago

This is likely not a problem with the component itself but with the grid we're using for display.

amyleadem commented 8 months ago

Transferring this issue to the uswds-site repo because the grid classes can be managed in the component preview template.

uswds / uswds-site