Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

HTML | CSS | Flexbox

@drod109

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

raya 2,850

@rayaatta

Posted

Hello 👋Dwayne N Rodrigues, congratulations on completing this challenge 🎉

I have some suggestions you might find interesting.

1 Since the background pattern images are decorative their alt attribute should be left empty.

"Images with no semantic meaning—such as those which are solely decorative—or of limited informational value, should have their alt attributes set to the empty string (""). " - Mdn webdocs

You can check out this article.

2 To body, replace

height: 100vh;
   height: 100svh;

with

min-height:100vh;

This prevents content overflowing on short devices or mobile devices in landscape orientation.

Otherwise your solution looks great 😉

Happy coding ✌️

Marked as helpful

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord