[Bug] Mobile responsiveness issue on program-index.html

[Arinzelight]

Description

The related posts section in program-index.html is not displaying properly on mobile devices. The layout is not responsive, causing elements to overflow.

Reproduction

1. Open program-index.html on a mobile device or in a responsive design testing tool.
2. Scroll to the related posts section.
3. Observe that the elements are not responsive and the layout breaks.
4. See error.

Expectation

The related posts section should adjust to different screen sizes, stacking elements vertically on smaller screens while maintaining a clean and user-friendly layout.

Screenshots

Environment

• Device: (e.g. iPhone 12, Samsung Galaxy S10)
• OS: (e.g. iOS 14.4, Android 11)
• Browser: (e.g. Safari, Chrome)
• Version: (e.g. iOS 14.4; Chrome 92)
• Other info: (e.g. screen resolution 375x812_)

Additional context

The CSS for the related posts section may need adjustments to ensure proper flexbox/grid settings

Resolution

• [x] I would be interested in resolving this bug.

[mannika763]

Hey @Arinzelight, Could you let me know the process for assigning this issue to me?

[Arinzelight]

Hi @mannika763, if the issue has been updated to ready for work, you can of course go ahead and work on the task then create a pull request because more than one person can work on a task or approved issue