Fix mobile view text overflow issue on Meshery LFX Projects page

[Rajesh-Nagarajan-11]

Description

In mobile view the page has a text overflow issue. The content, including the heading and other sections, overflows the screen and causes layout breaking and poor readability.

This happens because long text elements are not wrapping properly, leading to a broken UI on smaller screens.

URL : https://meshery.io/programs/lfx/2025

Expected Behavior

• All text should wrap properly and stay within the screen width.
• The layout should adjust cleanly on smaller screens.
• No content should overflow or overlap with other elements.
• The UI should remain readable and responsive on mobile devices.

Screenshots

Screencast.from.2025-08-05.14-00-16.webm

Environment:

• OS: Mac Linux Windows
• Browser: Chrome Safari Firefox
• Version:
• Device: Mobile

---

Contributor Guides and Handbook

The meshery.io website uses Jekyll and GitHub Pages. Site content is found under the master branch.

• 📚 See the Contributing to Meshery.io Website section of the readme.md and other contributing instructions, too.
• 🎨 Wireframes and designs for Meshery UI in Figma (open invite)
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack

[welcome]

Thanks for opening this issue. A contributor will be by to give feedback soon. In the meantime, please review the Newcomers' Guide and sure to join the community Slack.

[Rajesh-Nagarajan-11]

@leecalcote @vr-varad @Namanv0509 @FaheemOnHub I love to work on this issue , Kindly Assign this to me ?...