Text โEach DID corresponds to a Domainโ Not Fitting Properly on Mobile Screen
๐ Website: https://www.didnames.io/en ๐ฑ Platform: Mobile Browser (e.g., Chrome, Safari) ๐ Feature / Page: Homepage โ Intro / Description Section ๐ Environment: Mobile View ๐ Related: UI / Responsive Design
๐งพ Summary: On mobile devices, the text โEach DID corresponds to a Domainโ does not fit within the screen width. It appears either cut off, overflowing, or requires horizontal scrolling, which breaks the siteโs mobile layout.
๐งช Steps to Reproduce:
- Visit https://www.didnames.io/en using a mobile phone.
- Scroll to the section containing the text: > โEach DID corresponds to a Domainโ >
- Observe the layout and text fitting.
๐ฅ Actual Result:
- The text overflows outside the visible screen area.
- It does not auto-wrap or scale to fit within the display.
โ Expected Result:
- The text should automatically adjust or wrap properly within the screen size.
โ๏ธ Possible Cause:
- CSS issue in responsive design โ fixed width or non-wrapping container.
- Missing
word-wrap,max-width, orviewportscaling settings for mobile.
๐งฑ Severity: ๐ก Minor (UI/Layout Issue) ๐ฏ Priority: Medium ๐ Category: UI / Responsive Design
๐ก Suggested Fix:
- Apply CSS rules for responsive text wrapping:
javascript .did-text { word-wrap: break-word; white-space: normal; max-width: 100%; } - Use media queries for smaller screens to adjust font size and padding.
- Test on multiple devices (iPhone, Android, small tablets) to ensure consistency.