Fix layout misalignment in main section (image and content overlapping)

[Jyoti520]

Current Behaviour

On the main page, the content next to the image is not aligned properly. Instead of staying in its space, it overlaps with the image and spills into other sections, especially on different screen sizes. This breaks the layout and affects readability.

Expected Behaviour

• The content should stay properly aligned beside the image without overlapping.
• On all screen sizes, both the image and the text should remain within their own sections and adapt responsively.
• The layout should look clean, balanced, and visually appealing.

Screenshot

Proposed Solution

• Arrange the image and text side by side using proper layout.
• Add space (padding/margin) so the text stays in its area and doesn’t overlap.
• Make sure the design works well on all screen sizes by adjusting layout for mobile.
• Fix any overlapping by resizing the content or changing its position.

[github-actions]

👋 Thank you for raising an issue! We appreciate your effort in helping us improve. A maintainer from Dataverse will review it shortly. Stay tuned!

[Vedant-Kalbhor]

Hello @multiverseweb ,

I am contributing to GSSoC’25 and would like to work on resolving this alignment issue where the content next to the image overlaps and affects the layout on different screen sizes.

I plan to ensure that:

The content stays properly aligned beside the image without overlapping.

The design remains fully responsive across all screen sizes.

The layout appears clean, balanced, and visually appealing.

If eligible, I kindly request you to label this issue under gssoc and assign it to me. I am confident I can provide a robust and responsive fix for this problem.

Thank you for considering my request.