On very small screens (360px, common on budget Android devices), the project
result cards overflow their container. The tag row wraps awkwardly and the
"View Full Project" button text is clipped.
Expected Outcome:
At 360px viewport width:
- All cards fit within the viewport without horizontal scrolling
- Tags wrap cleanly to a second line if needed
- The action button text is fully visible
- Card padding is reduced to 20px on each side (from 28px)
Test using Chrome DevTools device emulation set to 360x800.
Files to look at:
static/style.css — add a @media (max-width: 380px) block
On very small screens (360px, common on budget Android devices), the project
result cards overflow their container. The tag row wraps awkwardly and the
"View Full Project" button text is clipped.
Expected Outcome:
At 360px viewport width:
Test using Chrome DevTools device emulation set to 360x800.
Files to look at:
static/style.css— add a@media (max-width: 380px)block