Text Overlapping on Narrow Screens

[LordAyo]

Bug report

Description

When using Responsively App on a narrow screen, such as iPhone SE 2022 dimensions, some text elements overlap with the container, causing the content to be unreadable. This issue impacts the usability of the homepage and reduces readability.

Minimal Reproduction

1. Open Responsively App.
2. Navigate to the Homepage.
3. Set the viewport width to match iPhone SE 2022 (375px).
4. Observe the text elements, which overlap with the container and are partially unreadable.

Screenshot error

[LordAyo]

Proposed solution

Hi Maintainers,

I've been investigating the text overlapping issue that occurs on narrow screens, such as with the iPhone SE (2022). After further testing and analysis, I believe that a suitable solution would involve accommodating a media query for screen widths of up to 320px, which matches the width of devices like the iPhone SE.

Adding this media query will help ensure that the text elements adjust properly on very small screens, preventing overlap and improving readability across various devices. This would significantly enhance the user experience for those accessing Responsively App on smaller viewports.

Please let me know your thoughts on this approach or if there are other adjustments you'd prefer. I'd be happy to assist further in implementing this solution.