What?

Fixes #50059

This PR ensures that long unbroken text (like URLs or long words) inside .is-layout-flex row layout blocks does not cause horizontal overflow on narrow viewports. It adds consistent text-wrapping behavior to match what is already applied to column layouts.

Why?

Currently, if a row layout block contains children with unbroken content (like long links or words), it can cause horizontal overflow, breaking the responsive layout. Column layout blocks already prevent this using overflow-wrap: break-word and word-break: break-word, but row layout blocks lack this protection. This update aligns both layout types to handle long content gracefully.

How?

.is-layout-flex:not(.is-vertical) > * {
  overflow-wrap: break-word;
  word-break: break-word;
}

This CSS rule, targets direct children of row layout flex containers, ensuring that long words or unbroken strings wrap within their container boundaries and don’t overflow.

Testing Instructions

1. Open a post or page in the block editor.

2. Insert a Group block and set its layout to "Row".

3. Add a Paragraph block inside the Group.

4. Paste in a long unbroken string (e.g., a long URL or continuous text with no spaces).

5. Resize the browser or preview on a narrow viewport.

6. Observe whether the text wraps correctly without overflowing the container.