On some themes, long URLs do not wrap on multiple lines.

[filipanoscampos]

Quick summary

On some themes, long URLs do not wrap on multiple lines to adapt to the screen width.

Steps to reproduce

1. On a website with the Lativ or the Enroute theme active add a long URL to a post or page
2. Notice how it won't wrap into multiple lines
3. Instead, it stretches to extend the width of the screen thus making the website difficult to use on smaller screens.

What you expected to happen

The URL to wrap into multiple lines. That is what happens with other themes such as Fewer or Poesis.

What actually happened

There is a very long URL that forces the width of the page to extend:

https://github.com/Automattic/wp-calypso/assets/2540430/f15c8f88-5e46-47a9-b494-8994fb92cf70

Impact

Some (< 50%)

Available workarounds?

Yes, easy to implement

Platform (Simple and/or Atomic)

Simple, Atomic

Logs or notes

Reproduced with Lativ and Poesis, so far. First reported on a retired theme by a user here: 7166515-zd-a8c

[github-actions[bot]]

Support References

This comment is automatically generated. Please do not edit it.

• [ ] 7166515-zen
• [ ] 8293392-zen

[cuemarie]

Hi @filipanoscampos , could you try uploading that screen recording you made once more? Looks like that didn't work when you filed the report. Thanks!

[cuemarie]

📌 REPRODUCTION RESULTS

• Tested on Simple – Replicated

📌 FINDINGS/SCREENSHOTS/VIDEO Replicated as described, using Lativ as an example:

https://github.com/Automattic/wp-calypso/assets/27249804/a5b2f284-59ee-4275-bea9-f77ac92bec42

I'm guessing this would need to be addressed at individual theme levels. 🤔 Keeping where it is for now to see if we get more reports in across different themes.

📌 ACTIONS

• Triaged

[filipanoscampos]

Another case, here: 8293392-zd-a8c

[davemart-in]

Seems like we should have separate issues for each theme. Breaking it up will make it more likely that a fix is shipped.