codepen.io - The text in the content (yellow background) is growing outside of the grid (yellowgreen background)

[Th3S4mur41]

URL: https://codepen.io/th3s4mur41/pen/xxermgL

Browser / Version: Edge 125.0.0
Operating System: Windows 10
Tested Another Browser: Yes Firefox

Problem type: Design is broken
Description: Items are misaligned
Steps to Reproduce:
The text in the content (yellow background) is growing outside of the grid (yellowgreen background) when the window size is shrinking horizontally.

The same issue is not reproducible in Firtefox

View the screenshot

Browser Configuration

• None

From webcompat.com with ❤️

[Th3S4mur41]

Here is the Firefox screenshot (expected behavior) as comparison

[softvision-raul-bucata]

We appreciate your report. I was able to reproduce the issue by following the steps to reproduce:

20240327_151212.mp4

Tested with:

Browser / Version: Firefox Release 124.0.1 (64-bit)/ Firefox Nightly 126.0a1 (2024-03-26) (64-bit) /Chrome Version 123.0.6312.59 (Official Build) (64-bit)
Operating System: Windows 10 PRO x64

Notes:

1. Reproducible on the latest build of Edge.
2. Works as expected using Firefox

Moving this to NeedsDiagnosis for further investigations.

[qa_13/2024]