@rayaatta
Posted
Hi there, 👋 congratulations completing this challenge 🎉. I have some tips you might find interesting.
**1.**since the bg pattern is only decorative its alt attribute should be empty . You can check out this article which explains why.
2.in your css
You have height:100svh;
on your body
Using an absolute height prevents scrolling on a short screened device or a mobile device in landscape mode
You should instead use min-height:100svh;
Such that it can scroll when content overflows the viewport.
Lastly, to make your card more responsive
Change
max-width: 350px;
to
max-width: min(90%,350px);
This means the card will be able to adjust on smaller screens below a width of 350px.
I hope this helps great solution you got there 🤩 Happy coding
Marked as helpful
@TGPJonathon
Posted
@rayaatta
Thank you so much for the comment! I honestly didn't know the height:100svh; prevented scrolling so I'll keep a note of that for the future.
The other tips are very helpful too!