What happened?
The Contact Info section on the website exhibits a text overflow issue when viewed on mobile devices or in responsive design mode at a screen width of approximately 535 pixels. The email address is partially hidden, impacting user accessibility to crucial contact details.
Proposed Solution:
Enable Text Wrapping: To ensure that long email addresses and similar text fit neatly within their designated areas, we should apply CSS word wrapping. This will allow text to break onto a new line instead of overflowing beyond its container, making it more readable on smaller screens.
Enhance Responsiveness: We can improve how the site looks on mobile devices by using CSS media queries. This approach lets us adjust the size of text and the dimensions of containers based on the screen size, ensuring that everything remains user-friendly and accessible, regardless of the device being used.
Screen shot
What browsers are you seeing the problem on?
Chrome
Record
[✓ ] I agree to follow this project's Code of Conduct
[ ✓] I'm a GSSOC contributor
[✓ ] I want to work on this issue
[✓ ] I'm willing to provide further clarification or assistance if needed.
Please let me know if the issue will be assigned to me.
Is there an existing issue for this?
What happened? The Contact Info section on the website exhibits a text overflow issue when viewed on mobile devices or in responsive design mode at a screen width of approximately 535 pixels. The email address is partially hidden, impacting user accessibility to crucial contact details.
Proposed Solution:
Enable Text Wrapping: To ensure that long email addresses and similar text fit neatly within their designated areas, we should apply CSS word wrapping. This will allow text to break onto a new line instead of overflowing beyond its container, making it more readable on smaller screens.
Enhance Responsiveness: We can improve how the site looks on mobile devices by using CSS media queries. This approach lets us adjust the size of text and the dimensions of containers based on the screen size, ensuring that everything remains user-friendly and accessible, regardless of the device being used. Screen shot
What browsers are you seeing the problem on? Chrome
Record
Please let me know if the issue will be assigned to me.